通过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. Android GIS开发系列-- 入门季(13)Gdal简单写个shp文件

    Gdal是用来读写栅格与矢量数据的,在Gdal官网,可以下载相关的资源进行平台的编译.其实Arcgis底层也是用Gdal来读取shp文件的,那在Android中可以直接读写shp文件吗,是可以的.这里 ...

  2. Ubuntu 16.04 LTS 搭建LAMP

    1. LAMP是一系列自由和开源软件的集合,包含了Linux.Web服务器(Apache).数据库服务器(MySQL)和PHP(脚本语言). Apache2 Web 服务器的安装 sudo apt i ...

  3. prototype与几个循环的心得

    <一>prototypeprototype其实是函数的一个属性,并且只有函数有这个属性,这个属性就是给函数增加函数或者属性的,比如写一个function one(){},那么one.pro ...

  4. oracle initialization or shutdown in progress 问题解决

    今天登录oracle时遇到oracle initialization or shutdown in progress 这个错误提示,在网上搜了下,试了非常多方法,最后结合几种方法结合,成功攻克了问题! ...

  5. php 获取今天,本周,本月,三个月内,半年内,今年的开始和结束时间

    $now = time();         //今天        $today_audit_num = 0;        $today_use_num = 0;        $beginTim ...

  6. Grails边做边学入门篇[1]--------大家一起来动手建立project和Domain

    近期工作比較忙,没空写博客了.我发现每周五的下午都是我最放松的时候,可能是迟延症的缘故吧...总是寄希望于周末,慢慢的.我的周末就被工作占领了. 希望大家不要有这种坏毛病.今日事,今日毕.当然我们程序 ...

  7. git 在一台机器上配置多个账户

    前提: 必须知道怎样配置git账户,请參考git官方教程:https://help.github.com/articles/generating-ssh-keys 这个教程能教你怎样生成ssh-key ...

  8. [DevExpress]GridControl分页的实现

    加入两个组件:BindingNavigator和BindingSource 代码: using System; using System.Collections.Generic; using Syst ...

  9. asp.net forms认证

    工作中遇到的asp.net项目使用forms认证.以前虽然用过,但其原理并不了解,现在甚至对什么是form认证也完全不知道了.对一样东西如果不清楚其原理,不知其所以然,那么死记硬背是无济于事的. as ...

  10. js 判断手机横竖屏的实现方法(不依赖任何其他库)

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...