Question

我是angularjs的新手，这是我第一篇关于stackoverflow的帖子。我试图创造现有角度的一小部分。我试图获取＆＃34; allproducts＆＃34;的动态网址。网址将包含/ allproducts / {对应的城市ID} 我的App.js看起来像这样：

myApp.config(function ($routeProvider) {
$routeProvider
.when('/',
{
    templateUrl: "view"
})
.when('/Cities',
 {
    templateUrl: "cities"
})
.when('/products',
{
    templateUrl: "view/cities_products"
})
.when('/allproducts/:id',
{
    templateUrl: "city/{id}/products"
})
.otherwise({
    template: 'NOT FOUND'
})
});

和rest在控制器内定义。这是为了获取城市数据

httpService.get(get_data_url3,"")
.then(function (result) {
 if (result.status == 200) {
  $scope.cities_data=result.data.data;
  console.log($scope.cities_data);
  }
 if (result.status == 404) {
  console.log("unauthorised");
 }
}, function (status) {
console.log(status);
});

这是为了点击相应城市获取产品数据

$scope.allCityProducts = function(city,path)
{
 $location.path('/allproducts/'+city.id);
 var get_products_url=initial_url+"products/"+city.id;
 $scope.selected_city=city;
 httpService.get(get_products_url,"")
 .then(function (result) {
   if (result.status == 200) {
    $scope.product_data=result.data;
   }
   if (result.status == 404) {
     console.log("unauthorised");
   }
 }, function (status) {
   console.log(status);
 });
}

城市的html代码低于其点击动态产品网址

<div class="view_context">
<br>
<div class="row table-heading">
  <div class="column medium-4">Cities <i class="fa fa-map-marker"></i></div>
  <div class="column medium-4">View Products <i class="fa fa-star"></i></div>
  <div class="column medium-4"></div>
</div>
<div class="table-inside column medium-12" ng-repeat="city in cities_data">
  <div class="column medium-4"> {{city.city_name}}</div>
  <div class="column medium-4"><a style="color:black;" ng-click="allCityProducts(city,path)"><i class="fa fa-share-square" style="margin-right:10px"></i>VIEW</a></div>
  <div class="column medium-4"></div>   
</div>

，产品页面位于

之下

<div class="table-inside table-white column medium-12">
    <div class="column medium-4">{{prod.product_name}}</div>
    <div class="column medium-3">{{prod.product_price_city | currency:"&#8377; "}}</div> 
    <div class="column medium-3"><a style="color:black;" data-reveal-id="productModal" ng-click="editproduct(prod)"><i class="fa fa-pencil-square"></i> VIEW/EDIT</a></div>
    <div class="column medium-2"><i class="fa fa-trash" ng-click="deleteproduct(prod,selected_city.id,$index)"></i></div>
  </div>

除非重新加载动态创建的产品页面，否则一切正常，因为httpservice正在处理ng-click =＆＃34; allcityproducts＆＃34;。城市id通过的地方。可以做些什么来解决这个问题？

Answer 1

要根据城市ID获取模板，您可以使用templateUrl功能，而不是直接使用URL字符串。 templateUrl函数将具有第一个参数（此处为params），它将具有路径参数对象。

<强>代码

templateUrl: function(params){
   return "city/"+ params.id +"/products"
}

在角度js应用程序

1 个答案: