通过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. Mycat集群方案收集(待实践)

    先收集,后续再实践. 我想,市面上开源方案中,涉及到高可用和负载均衡的部署,无论是哪一个产品应用,都基本离不开LVS+Keepalived+HAProxy+Nginx等等. 下面是收集的教程: htt ...

  2. Jafka源码分析——LogManager

    在Kafka中,LogManager负责管理broker上全部的Log(每个topic-partition为一个Log). 通过阅读源码可知其详细完毕的功能例如以下: 1. 依照预设规则对消息队列进行 ...

  3. Java解惑四:异常之谜

    谜题36 finally语句中的return语句会覆盖掉try语句中的. 谜题37 该部分还须要进一步理解 一个方法能够抛出的被检查异常集合是它所适用的全部类型声明要抛出的被检查集合的交集.

  4. android菜鸟之路-事件分发机制总结(二)

    ViewGroup事件分发机制 自己定义一个LinearLayout,ImageView和Button,小二,上代码 <LinearLayout xmlns:android="http ...

  5. windows7 配置 python开发环境

    1.安装python2.7     官网下载,安装,配置环境变量 path,命令行 执行python 2.easy_install 安装 win7 64位必须使用ez_setup.py进行安装. 方法 ...

  6. [翻译角]Headline English: A Captain Should Be Pitch Perfect at a Multitude of Skills (ESLPOD Blog)

    以下转自www.eslpod.com,翻译为本人添加.其余版权均归原网站所有. ESLPOD是一个英语学习网站,我最初知道这个网站,是因为“奶爸”<把你的英语用起来>(电子版3元)一书的推 ...

  7. CSP 201612-4 压缩编码 【区间DP+四边形不等式优化】

    问题描述 试题编号: 201612-4 试题名称: 压缩编码 时间限制: 3.0s 内存限制: 256.0MB 问题描述: 问题描述 给定一段文字,已知单词a1, a2, …, an出现的频率分别t1 ...

  8. SQl 事物+视图+游标+索引+锁

    一:事务: 是访问并可能更新数据库中各种数据项的一个程序执行单元(unit),事务是恢复和并发控制的基本单位. 事务的四个特性:ACID A:atomicity 原子性,事务里的所有操作都是一体的,要 ...

  9. mysql中decimal的使用

    float,double,decimal区别 创建表test_float_double_decimal CREATE TABLE `test_float_double_decimal` ( `id` ...

  10. 【Silverlight】Bing Maps学习系列(六):使用扩展模式(Extended Modes)(转)

    [Silverlight]Bing Maps学习系列(六):使用扩展模式(Extended Modes) 微软Bing Maps推出有有段时间了,通过不断的改进和新的地图更新,现在已经基本上形成了一套 ...