通过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. php-7.1编译记录

    编译php-7.1.28步骤 检查环境 ./configure \ --prefix=/u01/server/php-7.1.28 \ --enable-fpm \ --with-fpm-user=d ...

  2. substring详细用法,截取不行就用替换

    SUBSTRING 返回字符.binary.text      或      image      表达式的一部分.有关可与该函数一起使用的有效      Microsoft®      SQL    ...

  3. list去掉重复元素

    需求: 有list 里面含有重复元素,要求去掉重复元素: solution 1: >>> a [1, 2, 2, 1, 3, 4, 5, 6, 5] >>> set ...

  4. Spring 加载类路径外的资源文件

    原文:http://blog.csdn.net/gaofuqi/article/details/46417259 <bean id="propertyConfigurer" ...

  5. Codeforces 479B. Towers 暴力

    纯暴力..... B. Towers time limit per test 1 second memory limit per test 256 megabytes input standard i ...

  6. Androidbuttonshape形状资源码实现

    1.项目Src下创建drawable 看文档Develop/API Guides/App Resources/Drawable/Shape Drawable 单词:corners : 角  ;  gr ...

  7. JSP页面怎样导入优酷视频

    我在做的一个项目里面,应客户要求.要导入视频.然后我再考虑,视频是直接放在本地数据库的话,那么肯定会出现数据视频读取反应慢. 那么,就能够把视频先传到优酷上面,然后再直接应用优酷视频上的html代码, ...

  8. lua遍历目录

    require"lfs" function findindir (path, wefind, r_table, intofolder) for file in lfs.dir(pa ...

  9. 硬件十万个为什么——运放篇(五)PCB设计技巧

    1.在PCB设计时,芯片电源处旁路滤波等电容应尽可能的接近器件.典型距离是小于3MM 2.运算放大器芯片电源处的小陶瓷旁路电容在放大器处于输入高频信号时能够为放大器的高频特性提供能量电容值的选择依据输 ...

  10. struts2学习笔记(8)-------struts2的ajax支持

    struts2支持一种stream类型的Result,这样的类型的Result能够直接向client浏览器响应二进制,文本等. 我们能够再action里面生成文本响应,然后在client页面动态载入该 ...