Question

请原谅我对Angular的新奇之处，但我无法找到这个看似简单的程序的问题。而不是$ scope显示定义了LoginController的“Jonathan”，它在login.html中显示{{logins.username}}。如果我在index.html中移动控制器，它可以正常工作。当我将它移动到app.js文件时，它不起作用。任何帮助或方向将不胜感激。关注LoginController，下面是我的代码：

的index.html

<!DOCTYPE html>
<html ng-app="millersFormalsApp">
<head>
    <meta charset="UTF-8" />

     <!-- This add the Angular JS to the program --> 
    <script src="js/angular.min.js"></script>
    <script src="js/angular-route.min.js"></script>
    <script src="js/app.js"></script>

<!-- load the logo -->
    <img src="img/millers_icon.png">
</head>
<body>
   <h2> AngularJS Project</h2>        
    <div class="container">

        <div id="menu">
            <a href="Views/home.html" class="btn">Home</a>
            <a href="Views/login.html" class="btn">Login</a>
            <a href="Views/register.html" class="btn">Register</a>
        </div>

        <div ng-view=""></div> 

   </div>         

</body>
</html>

的login.html

<h2> Login Page</h2>
Username:
<input type="text" placeholder="Username" ng-model="logins.username"
<br />
Password:
<input type="text" placeholder="Password" ng-model="logins.password"

<h2>Your Username is {{ logins.username }} </h2>

app.js

var millersFormalsApp = angular.module('millersFormalsApp', ['ngRoute']);


//** Route Provider takes care of routing functionality based 
//** upon what has been selected 
millersFormalsApp.config(function ($routeProvider){
$routeProvider
    .when('/',
    {
        controller: 'HomeController',
        templateUrl: 'Views/home.html'
    })
    .when('/login',
    {
        controller: 'LoginController',
        templateUrl: 'Views/login.html'
    })
    .when('/register',
    {
        controller: 'RegisterController',
        templateUrl: 'Views/register.html'
    })
    .otherwise({redirectTo: 'home.html'});
});


//** Controllers are called by the Route Provider to specifically execute
//** the selected item
millersFormalsApp.controller('HomeController', function ($scope) 
    {
        $scope.homePage = "This is Miller's Home Page";

    });

millersFormalsApp.controller('LoginController', function ($scope)
    {
        $scope.logins = {username: "Jonathan", password: ""};
        console.log($scope);
    });


millersFormalsApp.controller('RegisterController', function ($scope) {

    $scope.register = { firstname: "", lastname: "" };

    console.log($scope);

});

AngularJs $ Scope不绑定

0 个答案: