Angularjs没有绑定数据,而html没有打印范围变量

时间:2017-07-09 14:26:21

标签: html angularjs

我的完整代码angular不是在html pice的body标签中打印变量,console.log()到处都有效。单击“提交”按钮也可以正常工作。

<html ng-app="fb">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap      /3.3.7/css/bootstrap.min.css"
 integrity="sha384-   BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" 
crossorigin="anonymous">

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5  /angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-cookie/4.1.0/angular-cookie.js"></script>

<script>
var app=angular.module('fb', []);

app.controller('home',function($scope){
    var hi;
    $scope.hi=5;
    //$rootScope.hola=9;
    console.log($scope.hi);
    //console.log($rootScope.hola);

    $scope.submitSignup=function()
    {
    var hi;
    $scope.hi=5;
    //$rootScope.hola=9;
    console.log($scope.hi);
    //console.log($rootScope.hola);
    console.log($scope.username);
        alert('button pressed');
    };
});

</script>
<head>
<title>Index</title
</head>

<body>
<div ng-controller='home'>
<input type="text" placeholder="Username" ng-model="username">
<br>
<input type="password" placeholder="Password" ng-model="password">
<br>

<button type="button" ng-click="submitSignup()">SignUp</button>

<br>

<p> {{username}} </p>


<p> {{hi}} </p>


{{hola}}


</div>

<p> index </p>
</body>
</html>

在这里抓我的头几个小时,任何帮助都将不胜感激。

2 个答案:

答案 0 :(得分:2)

使用 ng-app="fb"

在模板中添加ng-app

<强>样本

 
<html ng-app="fb">
<head>
<title>Index</title>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js"></script>
<script>
var app=angular.module('fb', []);
app.controller('home',function($scope){
    var hi;
    $scope.hi=5;
    //$rootScope.hola=9;
    console.log($scope.hi);
    //console.log($rootScope.hola);

    $scope.submitSignup=function()
    {
    var hi;
    $scope.hi=5;
    //$rootScope.hola=9;
    console.log($scope.hi);
    //console.log($rootScope.hola);
    console.log($scope.username);
        alert('button pressed');
    };
});
</script>
<body>
<div ng-controller='home'>
<input type="text" placeholder="Username" ng-model="username">
<br>
<input type="password" placeholder="Password" ng-model="password">
<br>
<button type="button" ng-click="submitSignup()">SignUp</button>
<br>
<p> {{username}} </p>
<p> {{hi}} </p>
{{hola}}
</div>
<p> index </p>
</body>
</html>

答案 1 :(得分:1)

您忘记使用ng-app="fb"

发起您的应用
 <body ng-app="fb">
    <div ng-controller="home">
        <input type="text" placeholder="Username" ng-model="username">
        <br>
        <input type="password" placeholder="Password" ng-model="password">
        <br>
        <button type="button" ng-click="submitSignup()">SignUp</button>

        <p> {{username}} </p>

        <p> {{hi}} </p>

        {{hola}}

    </div>
    <p> index </p>
</body>

</html>