zoukankan      html  css  js  c++  java
  • angualr ngRoute简单demo

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>路由</title>
    <style type="text/css">
    *{
    margin: 0;padding: 0;
    }
    body,html{
    100%;
    height: 100%;
    }
    </style>
    <script src="https://cdn.bootcss.com/angular.js/1.7.0/angular.min.js"></script>
    <script src="https://cdn.bootcss.com/angular.js/1.7.0/angular-route.min.js"></script>
    </head>
    <body>
    <div  ng-app="Route">
    <h1>路由</h1>
    <ul>
    <li>
    <a href="#!/">首页</a>
    </li>
    <li>
    <a href="#!/Com">电脑</a>
    </li>
    <li>
    <a href="#!/Ph">手机</a>
    </li>
    <li>
    <a href="#!/fsdfsdfsd">其他</a>
    </li>
    </ul>
      <div ng-view></div>
    </div>
       
    </body>
    </html>
    <script type="text/javascript">
    angular.module('Route',['ngRoute'])
    .config(['$routeProvider',function ($routeProvider) {
    $routeProvider
    .when('/',{template:''})
    .when('/Com',{template:'这是电脑页面'})
    .when('/Ph',{template:'这是手机页面'})
    .otherwise({redirectTo:'/'})
    }])
    </script>
  • 相关阅读:
    pytorch基础(4)-----搭建模型网络的两种方法
    Java
    Tools
    Maven
    Java
    DevOps
    Linux
    Java
    Java
    Nutch 使用总结
  • 原文地址:https://www.cnblogs.com/zgqdbxb/p/9505854.html
Copyright © 2011-2022 走看看