簡單AngularJS例如

我已經建立了一些簡單的AngularJS，我似乎無法去上班。我的觀點有：簡單AngularJS例如

<section ng-app="myApp"> 
    <header class="content_header"> 
    <h1>Cool App</h1> 
    </header> 

    <div> 
    <label>Name:</label> 
    <input type="text" ng-model="yourName" placeholder="Enter a name here"> 
    <hr> 
    <h1>Hello {{yourName}}!</h1> 
    </div> 

    <div ng-controller="AppCtrl"> 
    <h1>Message: {{message}}</h1> 
    </div> 

</section>

裏面angular_main.js我：

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

裏面app_ctrl.js我：

app.controller('AppCtrl', [ 
    '$scope', function($scope) { 
    return $scope.message = "Angular Rocks!"; 
    } 
]);

的JavaScript是按照正確的順序加載：

角庫
angular_main.js
app_ctrl.js

如果我改變<section ng-app="myApp">只是<section ng-app>那麼的Hello World形式的作品，但範圍的消息永遠不會奏效。

我錯過了什麼？

來源

2013-12-19 railsuser400

顯示在何處以及如何被你包括你的腳本。 – Stewie

默認情況下的任何角度控制器返回$scope默認。所以你並不需要顯式地指定return。試試這個：

app.controller('AppCtrl', [ 
    '$scope', function($scope) { 
    $scope.message = "Angular Rocks!"; 
    } 
]);

來源

2013-12-19 07:57:33 hawk

你不需要返回$ scope var。

window.app = angular.module('myApp', []); 
app.controller('AppCtrl', function ($scope) { 
    $scope.message = "Angular Rocks!"; 
});

見 http://jsfiddle.net/imhassan66/dEFfK/

來源

2013-12-19 08:57:27

我已經創建了一個小提琴，顯示你能解決這個問題的一種方式擺弄例如： http://jsfiddle.net/KB2U4/2/

我做了什麼：

我裝角資源文件。你有嗎？

我刪除了全球。你不需要它，使用angular.module("myApp")。請注意我沒有聲明任何依賴關係。通過這種方式，您可以重新獲得模塊並且不會污染全局名稱空間。

該代碼：

HTML保持不變。

angular.module('myApp', ["ngResource"]) 

//The following can also be in another file as long as it is loaded afterwards 

angular.module('myApp').controller("AppCtrl", ["$scope", function($scope){ 

    $scope.message = "This is a message"; 

}]);

來源

2013-12-19 09:16:28 Neikos

如何'ngResource'解決這個問題？ – hawk

他將其指定爲依賴項。也許他想在以後使用它？我不會去判斷，因爲它不是必需的，所以他必須從某個地方得到它並明確地表達出來。 – Neikos

(function (angular) { 
     "use strict"; 

     angular 
      .module("employee", ["ngSanitize", "ngFileUpload", "smart-table", "ui.bootstrap", "ui.router", "ui.select"]); 
    })(angular); 

(function (angular) { 
    "use strict"; 

    var config = ["$httpProvider", "$stateProvider", "$urlRouterProvider", 
     function ($httpProvider, $stateProvider, $urlRouterProvider) { 
      $urlRouterProvider.otherwise("/"); 

      $stateProvider 
       .state("EmployeeList", { 
        url: "/employees", 
        templateUrl: "/Employee/List", 
        controller: "EmployeeListController" 
       }) 
}]; 

    angular 
     .module("employee") 
     .config(config); 
})(angular);

來源

2015-09-07 05:09:30 Srinivas

簡單AngularJS例如

回答

相關問題