我的angularjs第四步

我的angularjs第四步

不一樣的寫法，但是得到的結果是一樣的

 

four.html

 1 <!DOCTYPE html>
 2 <html ng-app>
 3 <head>
 4     <title>four</title>
 5 </head>
 6 <body ng-controller="TextController">
 7     <p>{{someText}}</p>
 8     <script src="../js/angular.min.js"></script>
 9     <script>
10         function TextController($scope) {
11             $scope.someText = "我是第四個範例囉~!!";
12         }
13     </script>
14 </body>
15 </html>
four.html

這一個比較簡單，就是直接把$scope.someText的值傳給<p>{{someText}}</p>

 

five.html

 1 <!DOCTYPE html>
 2 <html ng-app>
 3 <head>
 4     <title>five</title>
 5 </head>
 6 <body ng-controller="TextController">
 7     <p>{{messages.someText}}</p>
 8     <script src="../js/angular.min.js"></script>
 9     <script>
10         var messages = {};
11         messages.someText = "我是第五個範例囉~!!";
12         function TextController($scope) {
13             $scope.messages = messages;
14         }
15     </script>
16 </body>
17 </html>
five.html

 

 

 

six.html

 1 <!DOCTYPE html>
 2 <html ng-app="myApp">
 3 <head>
 4     <title>six</title>
 5 </head>
 6 <body ng-controller="TextController">
 7     <p>{{message.someText}}</p>
 8     <script src="../js/angular.min.js"></script>
 9     <script>
10         var myAppModule = angular.module("myApp", []);
11 
12         myAppModule.controller("TextController",
13             function ($scope) {
14                 var message = {};
15                 message.someText = "我是第六個範例囉~!!";
16                 $scope.message = message;
17             });
18     </script>
19 </body>
20 </html>
six.html

 

 

 

posted @ 2014-03-02 01:20  jgedean  阅读(257)  评论(0)    收藏  举报