ng控制器不呈现数据到浏览器

我是Angular JS的新手，我在NG控制器中面临一些问题，它不会将值发送到浏览器屏幕。我正在使用角1.5.8。我怎样才能得到这个代码，以显示values.Attached是我的输出以及这里是我的代码：的script.jsng控制器不呈现数据到浏览器

(function() { 
var gem = { 
    name: "Dodecahedron", 
    price: 2.95, 
    description: "great stone" 
}; 
var app = angular.module('store', []); 
app.controller('StoreController', function() { 
    this.product = gem; 
}); 
})();

HTML文件

<!DOCTYPE html> 
<html data-ng-app="store"> 
<head> 
    <script type="text/javascript" src="angular.js"></script> 
    <script type="text/javascript" src="script.js" ></script> 
    <link rel="stylesheet" type="text/css"  href="bootstrap/bootstrap/css/bootstrap.min.css"> 
    <meta charset="UTF-8"> 
    <title>Angular Demo</title> 
</head> 
<body > 
{{"Hello" + "Angular"}} 
<br /> 
Here is Where our gem information will be displayed through the controller. 

<div ng-controller="StoreController"> 
    {{"Hello" + "Angular"}} 
    <h1>Product name : {{StoreController.product.name}}</h1> 
    <h2>Produce Price : {{StoreController.product.price}}</h2> 
    <p>Product Description : {{StoreController.product.description}}</p> 
</div> 

</body> 
</html>

来源

2016-09-22 Anuvrat Tiku

您可以使用$范围内可变控制

app.controller('StoreController', function ($scope) { 
    $scope.product = gem; 
});

在HTML中，您可以访问$范围内的变量，直接像这样

<div ng-controller="StoreController"> 
    {{"Hello" + "Angular"}} 
    <h1>Product name : {{product.name}}</h1> 
    <h2>Produce Price : {{product.price}}</h2> 
    <p>Product Description : {{product.description}}</p> 
</div>

来源

2016-09-22 06:23:09 Littlebird

谢谢哥们。有效 –

您应该使用$范围变量

app.controller('StoreController', function ($scope) { 
    $scope.product = gem; 
});

DEMO

否则，您可以使用Controller作为语法。

来源

2016-09-22 05:44:38 Sajeetharan

如果您不想使用$scope，则可以使用controller as systax。

<div ng-controller="StoreController as ctrl"> 
    {{"Hello" + "Angular"}} 
    <h1>Product name : {{ctrl.product.name}}</h1> 
    <h2>Produce Price : {{ctrl.product.price}}</h2> 
    <p>Product Description : {{product.description}}</p> 
</div>

来源

2016-09-22 05:50:32

你缺少“StoreController为StoreController”。

<div ng-controller="StoreController as StoreController"> 
    {{"Hello" + "Angular"}} 
    <h1>Product name : {{StoreController.product.name}}</h1> 
    <h2>Produce Price : {{StoreController.product.price}}</h2> 
    <p>Product Description : {{StoreController.product.description}}</p> 
</div>

工作扒手here。

来源

2016-09-22 05:50:40

ng控制器不呈现数据到浏览器

回答

相关问题