爲什麼我的角碼不工作？

-1

我寫了這個簡單的代碼作爲學習練習，但我不明白爲什麼我在我的瀏覽器中得到錯誤的結果。爲什麼我的角碼不工作？

結果我在瀏覽器中看到的是文字「{{helloMessage}}」而不是的「Hello World」。

代碼：

<!DOCTYPE html> 
<html lang="en" ng-app> 
<head> 
<meta charset="UTF-8"> 
<title>Hello World</title> 
</head> 
<body> 

<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1> 

<script src="angular.js"></script> 
<script type="text/javascript"> 
    function HelloWorldCtrl($scope){ 
     $scope.helloMessage = "Hello World"; 
    } 
</script> 

</body> 
</html>

這是輸出的，我沒有看到在瀏覽器中的任何錯誤：

來源

2016-02-27 Yanshof

你的錯誤是什麼？ –

可能是angular.js導入不正確!!! –

angular.js確實可以正確導入。 – Yanshof

這是你的代碼正常工作!!!!!!

function HelloWorldCtrl($scope){ 
 
     $scope.helloMessage = "Hello World"; 
 
    }

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

 
<div ng-app> 
 
    <h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1> 
 
</div>

來源

2016-02-27 12:45:00

upvoted你的良好發現。但注射src在頂部是必須的 –

<!DOCTYPE html> 

// call your myApp 
<html lang="en" ng-app="myApp"> 

<head> 
<meta charset="UTF-8"> 
<title>Hello World</title> 
</head> 
<body> 

<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1> 
<script src="angular.js"></script>

// create your angular app 
var app = angular.module("myApp",[]); 

// create ng-controller inside your angular myApp 
app.controller('MainCtrl', function($scope) { 
    $scope.helloMessage = "Hello World"; 
}

檢查該工作plunkr

來源

2016-02-27 12:41:23

你的代碼是不能工作的幾個原因。

您未創建Angular應用程序的實例。控制器必須作爲現有角度應用程序的屬性存在。它可以像這樣創建。 angular.module('app',[]) 現在控制器可以追加到它像這樣：
```
angular.module('app', []) 
    .controller('HelloWorldCtrl',HelloWorldCtrl); 

function HelloWorldCtrl($scope){ 
    $scope.helloMessage = "Hello World"; 
} 
```

您沒有使用角度依賴性注入正常。您可以確保您的參數$scope通過使用$inject屬性像這樣在運行時注入：

angular.module('app', []) 
    .controller('HelloWorldCtrl',HelloWorldCtrl); 

HelloWorldCtrl.$inject = ['$scope']; 

function HelloWorldCtrl($scope){ 
    $scope.helloMessage = "Hello World"; 
}

這些變化，代碼工作。請參閱working CodePen

來源

2016-02-27 12:45:15 rwisch45

不是這樣，兄弟看到我的答案和工作的重擊者。他只是在控制器之後注入了angularjs。我值得你的讚賞：P –

@AlexRumbaNicked你是對的 - 你得到了我的贊同。儘管如此，我仍然不喜歡它，對於Angular的新手來說，這有些太過分了，應該學習最佳實踐和設置方法。 – rwisch45

是的，但他的問題集中在一件事上，而你只是用CANON殺死了蒼蠅:)。你應該得到upvote爲你通過解釋雖然:)但他的代碼不工作，不是因爲你提供的原因。 –

您的代碼一切正常。只需在ng控制器之前注入src即<script src="angular.js"></script>即可。確保您的angular.js文件位於根目錄中。
您的代碼的plunker：http://plnkr.co/edit/Nhmg9FYJlHy9IwVsIJ0x?p=preview

<script src="angular.js"></script> 
<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1> 
<script type="text/javascript"> 
    function HelloWorldCtrl($scope){ 
     $scope.helloMessage = "Hello World"; 
    } 
</script>

更新：我想你的src到angular.js不在根。嘗試刪除<script src="angular.js"></script>和加入
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>在它的地方。

來源

2016-02-27 12:50:59

那麼，爲什麼在我的瀏覽器上我看到別的東西？ – Yanshof

你的兄弟在哪裏？我的意思是你提供的資源不能夠滿。你有類似brother.html的東西嗎？ –

不，只是簡單的谷歌瀏覽器 – Yanshof

當你想呈現一個angularJs應用程序變量在HTML中，它必須在角上下文中定義。因爲這個函數沒有在角度上下文中定義，而只是作爲一個javascript函數，它不起作用。

函數HelloWorldCtrl（$ scope）{$ scope.helloMessage =「Hello World」; }

來源

2016-03-18 06:06:09

爲什麼我的角碼不工作？

回答

相關問題