所以我一定做错了什么。我已经阅读了关于这方面的帖子，这里的大多数建议都建议建立一个工厂来保存视图之间的$scope数据。因此，我创建了一个工厂来绑定从选项复选框收到的$scope数据，但它在视图之间并不持久。这是有问题的代码。。有什么想法吗？？感谢
我的模块
var app = angular.module('app', ['ngMaterial','ui.router']);
我的工厂
app.factory('Options', function() {
var flavors = {};
flavors.getFlavors = function() {
return [
{ name: 'Vanilla', wanted: false },
{ name: 'Hazelnut', wanted: false },
{ name: 'Almond', wanted: false },
{ name: 'Caramel', wanted: false }];
};
return flavors;
});
我的控制器
app.controller('OrderFormController', function($scope, Options) {
$scope.flavors = Options.getFlavors();
});
我的html选项标记
<md-list-item ng-repeat="flavor in flavors"
layout="row">
<p> {{ flavor.name }} </p>
<span flex></span>
<md-checkbox aria-label="flavor.wanted"
class="md-accent"
ng-model="flavor.wanted">
</md-checkbox>
</md-list-item>
我的html产品标记
<md-card ng-repeat="item in items.results"
ng-controller="OrderFormController">
<img ng-src="{{item.img}}"
class="md-card-image"
alt="">
<md-card-content class="content">
<h2 class="md-title">{{ item.name }}</h2>
<h4>{{ item.price | currency }}</h4>
<p class="container"
ng-class="{show: show}">
{{ item.desc}}
</p>
<md-button class="md-primary"
ng-click="show = !show"
ng-show="!show">
<md-icon md-svg-icon="img/icons/unfold-more.svg"></md-icon>
<span>Show More</span>
</md-button>
<md-button class="md-primary"
ng-click="show = !show"
ng-show="show">
<md-icon md-svg-icon="img/icons/unfold-less.svg"></md-icon>
<span>Show Less</span>
</md-button>
</md-card-content>
<md-action-bar layout="row"
layout-align="end center"
ng-show="!addRemove">
<md-button class="md-fab md-accent fab"
aria-label="Add To Cart"
ng-click="addRemove = !addRemove;toggleActive(item)"
ng-class="{active:item.active}">
<md-icon md-svg-src="img/icons/add.svg"></md-icon>
</md-button>
</md-action-bar>
<md-action-bar layout="row"
layout-align="end center"
ng-show="addRemove">
<md-button class="md-fab md-accent fab"
aria-label="Remove From Cart"
ng-click="addRemove = !addRemove;toggleActive(item)"
ng-class="{active:item.active}">
<md-icon md-svg-src="img/icons/remove.svg"></md-icon>
</md-button>
</md-action-bar>
</md-card>
正在从Parse.com数据库中解析项目
编辑
所以我在这方面遇到了一些真正的问题，所以我在Parse.com上创建了我的对象类，现在不是用工厂初始化，而是用初始化
getOptions();
这样可以很好地加载并在不同视图之间持久化数据。。然而，正如下面提到的，我现在有一个问题，所有ng重复创建的子$scope当然都链接到父$scope中的值。我在下面得到了一个很好的开端，但仍然无法根据姓名或id创建唯一的$scope。我本来打算开始一篇新的帖子，但为了把所有内容都放在一个页面上，我想我只会更新帖子。。由于风味的值已经初始化，我不确定是否需要在工厂内重新初始化它们。。
工厂本身可能是一个singleton，这就是它在视图之间工作的原因，但每次调用getFlavours()返回的对象时，它都是列表的新实例。这就是为什么它似乎没有记录您的更改：它一开始就记录了，但一旦您再次尝试获取它们，就会用默认值重置它们。
您需要确保每次为给定的产品调用该列表时都会返回相同的列表实例。
通常情况下，按产品进行分离会很简单，因为我们知道每个ng重复都有自己的子作用域，可以保存该产品口味的单独实例。但是，因为您想要持久化那些需要单例服务的服务，所以您需要在该服务中按产品显式映射它们。要使用它，getFlavors()需要将产品名称作为唯一标识的参数
app.factory('Options', function() {
// To create a new set of flavors with default settings
function initFlavors() {
return [
{ name: 'Vanilla', wanted: false },
{ name: 'Hazelnut', wanted: false },
{ name: 'Almond', wanted: false },
{ name: 'Caramel', wanted: false }
];
}
var flavorsByProduct = {};
// Get the flavors for a given product
flavorsByProduct.getFlavors = function(productName) {
// On first access for a particular product, create a new set of flavors for it
if(!flavorsByProduct[productName]) {
flavorsByProduct[productName] = initFlavors();
}
return flavorsByProduct[productName];
};
return flavorsByProduct;
});
您需要更改
$scope.flavors = Options.flavors.getFlavors();代替$scope.flavors = Options.getFlavors();
因为您的工厂只返回了flavors对象。它不返回getFlavors()函数。