我是 Angular JS 的新手，我在 ng-controller 中遇到了一些问题，它没有将值发送到浏览器屏幕。我正在使用 Angular 1.5.8。我怎样才能让这段代码显示值。附件也是我的输出
这是我的代码:
脚本.js
(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>
最佳答案
您可以在 Controller 中使用 $scope 变量
app.controller('StoreController', function ($scope) {
$scope.product = gem;
});
在 html 中你可以像这样直接访问 $scope 变量
<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>
关于javascript - ng-controller 不向浏览器呈现数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39631088/