javascript - 访问 json 对象内的集合

Question

我是 Angular 新手在下面的 Controller 中，我需要访问 html 中的对象存储。但它不起作用。任何帮助

(function () {
    'use strict';


    angular.module('app').controller('BookController', ['$scope', function ($scope) {
    	$scope.book = {
    		id: 1,
    		name: 'Harry Potter',
    		author: 'J. K. Rowling',
    		stores: [
				 { id: 1, name: 'Barnes & Noble', quantity: 3 },
				 { id: 2, name: 'Waterstones', quantity: 2 },
				 { id: 3, name: 'Book Depository', quantity: 5 }
    		]
    	};
    }]);
    });

	<div ng-controller="BookController">
		
	 	
      {{book.stores}}
	 	</div>

Answer 1

您需要首先在最后的右括号之后和最后的分号之前使用 () 调用匿名函数，以便最后一行如下所示: })() ;.

您应该首先定义 Angular 模块，然后使用 Angular 组件修改它，例如controller，service，factory >、指令、过滤器等

angular.module('app', [])

然后在您的页面上添加 ng-app="app"。

标记

<div ng-app="app" ng-controller="BookController">
    {{book.stores}}
</div>

Plunkr Here

更新

如果假设 stores 对象中有多个 store，并且您想在 html 上显示它们，那么您可以 ng-repeat 指令。它将重复 html 上的每个元素

<div ng-repeat="s in book.stores">
   <span>{{s.name}}</span>
   <input type="text" ng-model="s.name" />
   <input type="numeric" ng-model="s.quantity" />
</div>

Updated Plunkr