角度變量不在HTML中顯示

我想刷新我對Angular的知識，而且我似乎無法理解一些概念，「控制器爲」模式似乎不起作用，例如，甚至儘管它似乎比$scope簡單得多。角度變量不在HTML中顯示

我無法獲得一個簡單的變量來顯示在我的HTML中。

這裏有兩段代碼有問題：

app.js

angular 
    .module('routerApp', ['']) 
    .controller('mainController', function() { 
     'use strict'; 
     var vm = this; 
     vm.bigMessage = 'A smooth sea never made a skilled sailor'; 
    })

的index.html（重剝離下來）

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script> 
     <script src="js/app.js"></script> 
    </head> 
    <body class="container" ng-app="routerApp" ng-controller="mainController as main"> 
     <h1>{{ main.bigMesssage }}</h1> 
    </body> 
</html>

有趣的是瀏覽器甚至不會渲染"{{ main.bigMessage }}"，而是不顯示任何內容。然而，在源代碼中有{{ ... }}部分。

來源

2015-06-21 zcserei

您曾在依賴陣列支架這是不對的角度是要搜索的依賴名稱爲'' & obiviously不會有任何扶養使用該名稱&就是爲什麼在角控制檯拋出$injector發現錯誤添加''。，因爲你不會有任何依賴你，應該是[]

代碼

angular 
.module('routerApp', []) //<--change here 
.controller('mainController', function() { 
    'use strict'; 
    var vm = this; 
    vm.bigMessage = 'A smooth sea never made a skilled sailor'; 
})

你也曾經有過錯字在這裏{{main.bigMesssage}}應該bigMesssage是bigMessage那麼這將成爲

{{main.bigMesssage}}

Demo Plunkr

來源

2015-06-21 09:06:50

謝謝pankajparkar！我一直試圖在那裏添加和刪除東西，最後忘記刪除引號，但是，這並不是問題，因爲我嘗試了兩種方法。我甚至不能相信，我已經花了最後一個小時試圖找到...錯字。我的眼睛可能已經太累了，謝謝你發現我的錯誤。 – zcserei

@zcserei這就是問題..檢查我的更新說明..你也有錯誤的HTML ..很高興幫助你..謝謝:) –

你有wri tten一切是正確的，除了你的bigmessage變量法術

<body class="container" ng-app="routerApp" ng-controller="mainController as main"> 
     <h1>{{ main.bigMessage }}</h1> 
    </body>

控制器

angular 
    .module('routerApp', []) 
    .controller('mainController', function() { 
     var vm = this; 
     this.bigMessage = 'A smooth sea never made a skilled sailor'; 
    })

看看這個小提琴：https://jsfiddle.net/bjwov6f1/1/

這不是找你的變量，爲什麼它不顯示任何

欲瞭解更多信息，請點擊此鏈接：https://thinkster.io/egghead/experimental-controller-as-syntax

來源

2015-06-21 09:22:24

角度變量不在HTML中顯示

回答

相關問題