zoukankan      html  css  js  c++  java
  • Angular(ng-include指令-嵌套)

    html部分

    .........................................................................................

    <!DOCTYPE html>
    <html lang="en" ng-app="myApp">
    <head>
    <meta charset="UTF-8">
    <title>ng-include指令</title>
    <style>
    .large{
    background-color: blue; color: white;
    text-align: center;
    font: bold 50px/80px verdana, serif;
    border: 6px black ridge; }
    .small{
    background-color: lightgrey;
    text-align: center;
    border: 1px black solid; }
    a{
    color: blue; text-decoration: underline;
    cursor: pointer; }
    </style>

    </head>
    <body>
    <div ng-controller="MyCtrl">
    [<a ng-click="titleBar='large.html'">使用大标题</a>]
    [<a ng-click="titleBar='small.html'">使用小标题</a>] <!--titleBar 标题栏-->
    <div ng-include="titleBar"></div> <!--ng-include 指令用于包含外部的 HTML 文件-->
    </div>
    </body>
    <script src="js/angular-1.3.0.js"></script>
    <script src="js/t8.js"></script>
    </html>

    ........................................................................................
    js部分
    var myApp=angular.module('myApp',[]);
    myApp.controller('MyCtrl',function ($scope) {
    $scope.titleBar="small.html"
    $scope.titleBar="large.html"
    });


  • 相关阅读:
    git代码回退
    7 用两个栈实现队列
    《Java并发编程实战》学习笔记
    226. Invert Binary Tree
    Interface与abstract类的区别
    Override和Overload的区别
    Java面向对象的三个特征与含义
    String、StringBuffer与StringBuilder的区别
    Hashcode的作用
    Object有哪些公用方法
  • 原文地址:https://www.cnblogs.com/YoogaChan/p/6920872.html
Copyright © 2011-2022 走看看