0
私はangularjsを使ってオンラインストアを構築していますが、details.htmlにリンクして特定のアイテムの詳細を表示する方法を考えています。現在ビューをクリックすると、moreボタンurlにアイテムの名前が表示されます。私がそれを表示できる唯一の方法は、このようなリンクを作ることです：＃/ details /：{{item.name}}。私がオンラインで読んだことのすべては、＃/ details /：nameでなければならないと言っていますが、それはURLの中の名前であり、詳細ではない/ MacBook Proを例にしています。私が正しい方法で行うと、それはホームページにリダイレクトされます。これまでのところ私のコードです。
app.js
var myApp = angular.module('app', ['ngRoute']);
myApp.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider) {
$routeProvider.
when('/home',{
templateUrl: 'partials/home.html',
controller: "storeCtrl"
}).
when('/about',{
templateUrl: 'partials/about.html',
controller: "storeCtrl"
}).
when('/computers',{
templateUrl: 'partials/computers.html',
controller: "storeCtrl"
}).
when('/smartphones',{
templateUrl: 'partials/smartphones.html',
controller: "storeCtrl"
}).
when('/tablets',{
templateUrl: 'partials/tablets.html',
controller: "storeCtrl"
}).
when('/details/:{{item.name}}',{
templateUrl: 'partials/details.html',
controller: "storeCtrl"
}).
otherwise({
redirectTo: '/home'
});
}]);
myApp.controller('storeCtrl', ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams) {
$scope.homeHeading = 'All Products';
$scope.aboutHeading = 'About Us';
$scope.computersHeading = 'Computers';
$scope.smartphonesHeading = 'Smartphones';
$scope.tabletsHeading = 'Tablets';
$http.get('js/products.json').then(function(result) {
$scope.products = result.data;
});
$scope.minusOne = function(index) {
$scope.products[index].dislikes += 1;
};
$scope.plusOne = function(index) {
$scope.products[index].likes += 1;
};
}]);
computers.html
<div>
<h1>{{computersHeading}}</h1>
<div class="product col-md-4" ng-repeat="item in products | filter:search | filter:'Laptop'">
<img ng-src="{{ item.cover }}" >
<h3>{{ item.name }}</h3>
<p class="price">{{ item.price }}</p>
<p class=""> <b>Storage</b>: {{ item.specs.storage }}</p>
<p> <b>Memory</b>: {{ item.specs.memory }}</p>
<!----- Save ratings for details page
<div class="rating">
<p class="likes" ng-click="plusOne($index)">
<i class="fa fa-thumbs-up"></i>
{{ item.likes }} </p>
<p class="dislikes" ng-click="minusOne($index)"><i class="fa fa-thumbs-down"></i> {{ item.dislikes }} </p>
</div> -->
<a href="#/details/:{{item.name}}" class="btn btn-custom"> View Product</a>
</div>
</div>
は再度URLに表示する項目名を取得する唯一の方法は、URLにブラケットを持つことであると私はことを知っています間違っています。どんな助けでも大歓迎です。