Question

这是我的主页在演示模块

的帮助下实现路线

<!DOCTYPE html>
<html >
<head>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<div ng-app="demo">
    <!--HEADER - NAVIGATION-->
    <p align="center">
        <b><u>My First AngularJS Demo App!</u></b></p>
    <p align="center">
        <a href="#DataBinding">Data Binding</a> | <a href="#Expressions">Expressions</a>
    </p>
    <!--INCLUDE REFERENC AJS SCRITS-->
    <script src="Scripts/angular.min.js"></script>
    <script src="Scripts/angular-route.js"></script>
    <!--INCLUDE REFERENC AJS SCRITS-->

    <script>
        // Code goes here
        var demo = angular.module('demo', ['ngRoute']);
        demo.config(function ($routeProvider) {
            $routeProvider.when('/', {
                templateUrl: 'Default.htm'
            }).
    when('/DataBinding', {
        templateUrl: 'DataBinding.htm',
        controller : 'myCtrl'
    }).
otherwise({ templateUrl: 'main.html' });
        })
    </script>


<script>
    var app = angular.module("myApp1", []);
    app.controller("myCtrl", function ($scope) {
        $scope.firstName = "Sachin";
        $scope.lastName = "Tendulkar";
    });
</script>

现在，DataBinding.htm正在使用名为 myApp1 的主页中的另一个模块。这是DataBinding.htm代码，

<div na-app="myApp1">
{{ firstName + " " +  lastName }}
</div>

预期输出：当我点击数据绑定时，页面应显示Sachin Tendulkar

DataBinding.htm这在我单击DataBinding链接时无效！它只是显示 {{ firstName + " " + lastName }} 而非实际值。

任何帮助表示赞赏！

AngularJS在同一视图中出现多个模块的问题

0 个答案: