Я делаю сайт заказа еды онлайн, используя AngularJS .Что я хочу сделать, это изменить фильтр, нажав на вкладки категории.Это мой код:
shoppingCart.prototype.changeFilter = function (cat) {
var ref = document.getElementById("refresh");
category = cat;
}
Мой HTML выглядит следующим образом:
<ul class="menu-filter-list list-inline margin-b-40 text-center">
<li>
<a ng-click="cart.changeFilter(null)" id="refresh">All</a>
</li>
<li data-filter=".{{product.category}}" ng-repeat="product in store.products | unique:'category'" >
<a ng-click="cart.changeFilter(product.category)">
{{product.category}}
<span></span>
</a>
</li>
</ul>
Фильтр применяется к ng-click="cart.changeFilter(product.category)"
ОБНОВЛЕНИЕ: controller.js
'use strict';
// the storeController contains two objects:
// - store: contains the product list
// - cart: the shopping cart object
function storeController($scope, $routeParams, DataService) {
// get store and cart from service
$scope.store = DataService.store;
$scope.cart = DataService.cart;
// use routing to pick the selected product
if ($routeParams.productSku != null) {
$scope.product = $scope.store.getProduct($routeParams.productSku);
}
}
app.js
'use strict';
// App Module: the name OnlineOrders matches the ng-app attribute in the main <html> tag
// the route provides parses the URL and injects the appropriate partial page
var storeApp = angular.module('OnlineOrders', ['ui']).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/store', {
templateUrl: 'partials/store.htm',
controller: storeController,
}).
when('/products/:productSku', {
templateUrl: 'partials/product.htm',
controller: storeController
}).
when('/cart', {
templateUrl: 'partials/shoppingCart.htm',
controller: storeController
}).
when('/processing', {
templateUrl: 'partials/processingOrder.htm',
controller: storeController
}).
otherwise({
redirectTo: '/store'
});
}]);
// create a data service that provides a store and a shopping cart that
// will be shared by all views (instead of creating fresh ones for each view).
storeApp.factory("DataService", function () {
// create store
var myStore = new store();
// create shopping cart
var myCart = new shoppingCart("OnlineOrders");
myCart.addCheckoutParameters("Stripe", "pk_test_9iwiq8RA0aacvfi350h76350");
// return data object with store and cart
return {
store: myStore,
cart: myCart
};
});
Я добавил свой controller.js и app.js .
Может кто-нибудь помочь мне выяснить, почему интерфейс не меняется?