AngluarJS ng-controller的第一步

我今天開始研究Angularjs，並且遇到了一個我無法解決的問題。AngluarJS ng-controller的第一步

我添加了第一個控制器，它不會工作。添加控制器會打破我的整個應用程序

<html ng-app> 
<head> 
</head> 
<body> 
    <div ng-controller="test"></div> 

    <input type="text" ng-model="name" /> {{ name }} 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 

    <script> 

    function test($scope) { 

     $scope.people=''; 

    } 

    </script> 

</body> 
</html>

如果我冒了出來：

<div ng-controller="test"></div>

一切正常。我已經添加了該行的nothings作品了。我知道我的控制器沒有做任何事情，也沒有使用範圍。這是因爲我打破了一個更大的例子。

儘管如此，控制器存在並將其添加到我的視圖不應該導致問題。

也許這只是一個小錯誤，但我無法找到它！

我遵循本指南：https://youtu.be/i9MHigUZKEM?t=30m6s。

感謝您的幫助！

來源

2015-06-04 almo

只是供參考，這是一個很好的視頻，這裏經常討論，但除非你按照視頻的信，包括他包括的每個腳本的版本，這不會是你遇到的第一個突破性改變。 – Claies

感謝您的信息。也許不是那麼糟糕，因爲它讓我更詳細地看到某些東西似乎不起作用的細節;） – almo

你很可能會遵循一個稍微過時的指南。全局控制器聲明（function test($scope) {）從未真正用於Angular，但它們在快速入門指南中很受歡迎，並且經常用於生產應用程序。在Angular 1.3中，爲了消除這種做法做出了重大改變。

從角度1.3開始，有必要用角度模塊完全聲明你的控制器。

<html ng-app="myApp">

在JS：

var app = angular.module('myApp', []); 

app.controller("test", ["$scope", function($scope){ 
.... 
}]);

來源

2015-06-04 18:29:56 Claies

這就是問題所在。爲了完整性，我在我的問題中添加了指南的鏈接。 – almo

您需要創建一個模塊才能使用！ AngularJS在模塊上運行。

angular.module('myApp', []); 

<html ng-app="myApp">...</html>

來源

2015-06-04 18:21:11 tmanion

角度與您的NG-應用聲明自舉本身，但您尚未創建「測試」控制器（你正在試圖用function test();做，但這不是正確的語法）。

你需要做的第一件事情就是創建一個模塊：

var app = angular.module('MyApp', [])

在你的HTML設置ng-app='MyApp'。現在你有一個模塊，註冊到DOM，可以包含你的控制器。

要創建您的控制器，下面的模塊聲明這樣寫：

app.controller('test', ['$scope', function($scope){ 
    $scope.people = ''; 
}]);

這使用inline聲明來命名控制器，定義它的依賴（$範圍），並注入那些依賴關係到你的控制器的主機功能。

理想情況下，你會將這些全部分解到不同的文件中（共同的起點是模塊聲明和配置的app.js，控制器的controller.js等。）

來源

2015-06-04 18:51:40

AngluarJS ng-controller的第一步

回答

相關問題