AngularJS教程不绑定数据
[英]AngularJS tutorial not binding data
问题描述
I have a very basic example that isn't working: I have two aspects, the index.html and the main.js. 
我有一个非常无效的基本示例：我有两个方面，即index.html和main.js。 They are in the same folder: 它们在同一文件夹中：
<!DOCTYPE html>
<html>
<head>
<title> AngularJS Tutorials </title>
<link rel="stylesheet" href="css/foundation.min.css">
<script src="main.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="FirstCtrl">
<h1>{{data.message}}</h1>
</div>
</div>
<script type="text/javascript" src="js/angular.min.js"></script>
</body>
</html>
main.js main.js
function FirstCtrl($scope) {
$scope.data = {message: "Hello"};
}
my page shows this: 我的页面显示如下：
{{data.message}}
2 个解决方案
解决方案1
2 已采纳 2015-11-04 23:45:17
You need to add the controller to the angular module. 您需要将控制器添加到角度模块。 you can use the controller function to add the js function for your controller. 您可以使用controller函数为controller添加js函数。
var FirstCtrl = function FirstCtrl($scope) {
$scope.data = {message: "Hello2"};
};
angular.module("myApp",[]).controller("FirstCtrl",FirstCtrl);
If you already had the angular module defined somewhere else in the page, Use this version. 如果您已经在页面的其他位置定义了角度模块，请使用此版本。
angular.module("myApp").controller("FirstCtrl",FirstCtrl);
Here is a working sample http://jsbin.com/tiroteharu/edit?html,js,console,output 这是一个工作示例http://jsbin.com/tiroteharu/edit?html,js,console,output
解决方案2
2 2015-11-04 23:47:56
<script src="~/Scripts/angular/angular.js"></script>
<script>
var myApp = angular.module('myApp', []);
myApp.controller('FirstCtrl', ['$scope', function ($scope) {
$scope.data = { message: "Hello" };
}]);
</script>
<div ng-app="myApp">
<div ng-controller="FirstCtrl">
<h1>{{data.message}}</h1>
</div>
</div>
More help read: https://docs.angularjs.org/guide/controller 有关更多帮助，请阅读： https : //docs.angularjs.org/guide/controller
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.