Question

我是angularJS的新手。我目前正在建立一个小型移动商店，我在首页显示所有产品的数据，点击产品，我想在下一页显示产品的描述。

当我点击产品时，我能够重定向到下一页，但不能重定向到页面的内容。

我的index.html

<div class="container">
<header>
<h1>My Mobile Store</h1>
</header>
<hr class="header-seperator">
<nav class="navbar navbar-default">
<div class="container-fluid">
 <div class="navbar-header">
    <a class="navbar-brand" href="#">My Mobile Store</a>
</div>
<div>
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Mobiles</a></li>
    <li><a href="#">Electronics</a></li>
    <li><a href="#">Fashions</a></li>
    <li><a href="#">Footwears</a></li>
  </ul>
  </div>
</div>
</nav>
<div ng-view></div>
</div>

我的app.js

(function() {
var storeConfig = function($routeProvider) {
$routeProvider
.when('/', {
    controller: 'StoreController',
    templateUrl: 'views/products-list.html',
    controllerAs: 'StreCtrl'
})
.when('/product', {
    controller: 'StoreController',
    templateUrl: 'views/product.html',
    controllerAs: 'prodCtrl'
});
};

var app= angular.module('mystore',['ngRoute']).config(storeConfig); 
app.service('sharedProperties', function () {
    var product = [];

    return {
        getProduct: function () {
            console.log(product);
            return product;
        },
        setProduct: function(value) {           
            product = value;
            //console.log(product);
        }
    };
});

app.controller('StoreController',[ '$http', 'sharedProperties',  function($http,sharedProperties) {
var store = this;
store.products = [];
store.error = "false";
store.item = [];

$http.get('data/products.json').success(function(data) {
store.products = data;
 }).error(function() {
 store.error = "true";
 });

store.showProduct = function(product) {
sharedProperties.setProduct(product);
};

store.item = sharedProperties.getProduct;
console.log("Store Item");
console.log(store.item);
}]);
})();

我无法在store.item中获取数据。我在做什么错。任何帮助都将不胜感激。

先谢谢!!

Answer 1

您正在为范围对象分配方法引用，而不是需要调用方法。

从

更改

store.item = sharedProperties.getProduct;

要

store.item = sharedProperties.getProduct();

无法将数据提供给AngularJS中的下一页

1 个答案: