Question

我首先调用我的MVC-app中的一个方法，该方法返回一个对象列表 $scope.centrals：

var result = $http.get("/Home/GetCentraler");
    result.success(function (data) {
        $scope.centraler = data;
    });

在我的主视图中，我显示如下项目：

<tr ng-repeat="product in centraler | orderBy:'name' | filter:search" >
    <td class="tdCenter"><img ng-src="{{product.img}}" alt="{{product.name}}" /></td>
    <td>
        <a href="#/products/{{product.id}}"><b>{{product.namn}}</b></a><br />
            {{product.description}}
    </td>
</tr>

如您所见，当我点击product.name时，我想在特定视图中显示该项目。我必须遗漏一些东西，我想我应该在MVC中创建一个新方法来挑选出包含被点击的Id的对象。但是我怎样才能将这个对象传递给：

<a href="#/products/{{product.id}}"

我的路由设置如下：

var storeApp = angular.module('MyAPp', ['ngRoute']).
  config(['$routeProvider', function ($routeProvider) {
      $routeProvider.
          when('/store', {
              templateUrl: '/Angular/partials/store.htm',
              controller: storeController
          }).
          when('/products/:Id', {
              templateUrl: '/Angular/partials/product.htm',
              controller: storeController
          }).
          otherwise({
              redirectTo: '/store'
          });
  }]);

EDIT1：

当我现在点击productname-link时，它会转到正确的视图，但没有任何内容。

EDIT2：

function storeController($scope, $routeParams, $http) {

    var result = $http.get("/Home/GetCentraler");

    result.success(function(data) {
        $scope.centraler = data;

        function activate() {
            $scope.search = $routeParams;
            if ($routeParams.Id) {
                angular.forEach($scope.centraler, function(item) {
                    if (item.id == $routeParams.Id) {
                        $scope.item = item;
                    }
                })
            }
        };
    });
}

Answer 1

请注意，该演示可以帮助您http://plnkr.co/edit/XyWvKQLuQsegoyG19sg5?p=preview

我无法在您的代码中看到storeController的定义，并且应该将路径配置中的控制器名称作为字符串传递。对于产品视图和商店视图，您应该拥有相当不同的控制器

.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
    when('/store', {
       templateUrl: '/Angular/partials/store.htm',
      controller: 'storeController'
    }).
    when('/products/:Id', {
      templateUrl: '/Angular/partials/product.htm',
      controller: 'storeController'
    }).

    otherwise({
      redirectTo: '/store'
    });
  }
])

将项目传递到角度路线并在新视图中打开

1 个答案: