通过Angular JS的官方教学文档,了解 routeProvider 的用法, angular.module('aaa').config(['$locationProvider','$routeProvider', funtion config($locationProvider, $routeProvider){

app.config.js ----

angular.
  module('phonecatApp').
  config(['$locationProvider' ,'$routeProvider',
    function config($locationProvider, $routeProvider) {
      $locationProvider.hashPrefix('!');

$routeProvider.
        when('/phones', {
          template: '<phone-list></phone-list>'
        }).
        when('/phones/:phoneId', {
          template: '<phone-detail></phone-detail>'
        }).
        otherwise('/phones');
    }
  ]);

index.html ---

<div ng-view></div>

phone-details.components.js

angular.
  module('phoneDetail').
  component('phoneDetail', {
    template: 'TBD: Detail view for <span>{{$ctrl.phoneId}}</span>',
    controller: ['$routeParams',          
      function PhoneDetailController($routeParams) {
        this.phoneId = $routeParams.phoneId;  //取得变量
      }
    ]
  });

目前能刊出 module能嵌套,然后有component, config.

Angular JS (2)的更多相关文章

  1. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  2. angular.js:13920 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- testServe

    angular.js:13920 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- testSer ...

  3. (翻译)Angular.js为什么如此火呢?

    在本文中让我们来逐步发掘angular为什么如此火: Angular.js 是一个MV*(Model-View-Whatever,不管是MVC或者MVVM,统归MDV(model Drive View ...

  4. angular.js写法不规范导致错误

    以下写法:没有明确指定module和controller,写法不规范. 更改angular.js版本会出bug. <html ng-app> <head> <title& ...

  5. Angular.js实现折叠按钮的经典指令.

    var expanderModule=angular.module('expanderModule',[]) expanderModule.directive('expander',function( ...

  6. Angular.js通过bootstrap实现经典的表单提交

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel= ...

  7. python , angular js 学习记录【1】

    1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...

  8. Angular JS 学习之路由

    1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...

  9. Angular JS 学习之Bootstrap

    1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...

  10. Angular.js 的初步认识

    MVC模式 模型(model)-视图(view)-控制器(controller) Angular.js采用了MVC设计模式的开源js框架 1.如何在angular.js建立自己的模块(model),控 ...

随机推荐

  1. Windows7下ftp服务器

    1. 创建用户 2. 创建ftp服务 3. 管理ftp站点 4. 权限编辑 5. 绑定iP和端口 6. 访问 7. Java代码上传文件 import java.io.File; import jav ...

  2. Oracle表空间 ORA-01653:

    --1.查看表空间USERS使用情况SELECT T.TABLESPACE_NAME,D.FILE_NAME, D.AUTOEXTENSIBLE,D.BYTES,D.MAXBYTES,D.STATUS ...

  3. Linux学习系列之Inotify+Rsync实现实时数据同步

    Inotify简介 inotify介绍 inotify是一种强大的.异步的文件系统监控机制,linux内核从2.6.13起,加入了inotify的支持,通过inotify可以监控文件系统中添加.删除. ...

  4. POJ 3370 Halloween treats(抽屉原理)

    Halloween treats Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 6631   Accepted: 2448 ...

  5. C# .NET想要另存一个项目,sln文件丢了怎么办

    如下图所示,我想要另存一个工程,把 V4.4整个的项目另存为V4.5,我可以把解决方案文件(.sln)改名字,但是我没法把文件夹改名字,改了打开sln就说找不到.   很简单的一个思路是反正sln是多 ...

  6. Nginx中配置vue,react项目地址

    如题 像以前在Nginx中配置域名解析的时候只需要在conf.d文件夹下添加对应的xx.conf文件(当然了你也可以在nginx.conf)下配置. 如果是以前的老项目只需要在配置文件中server内 ...

  7. HDU 5324 Boring Class【cdq分治】

    这就是一个三维排序的问题,一维递减,两维递增,这样的问题用裸的CDQ分治恰好能够解决. 如同HDU 4742(三维排序,一个三维都是递增的) 由于最小字典序比較麻烦,所以要从后面往前面做分治.每一个点 ...

  8. JavaScript变量提升演示样例

    直接先看两段代码 function getSum() { var sum = a + b; var a = 1; var b = 2; return sum; } getSum(); function ...

  9. UVa 11582 Colossal Fibonacci Numbers! 【大数幂取模】

    题目链接:Uva 11582 [vjudge] watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fil ...

  10. 【Noip模拟By yxj】

    1.randomDescription 给定4个参数A0,N,c,p,你需要按下式构造A1~AN: A[i]=(A[i-1]2+c)mod p 之后,你需要求出A1~AN中,第K大的数值.Input ...