如何将角度 $scope 数据加载到 location.href 中？

Question

我有以下

    <div>
        <div ng-repeat="data in datas" title='{{ data.name }}' onClick="location.href='\{{ data.name }}'" >{{ data.name }}</div><br/>
    </div>

在我的角度文件中

 var mainApp= angular.module('mainApp',[]);

 mainApp.controller('formCTR',['$scope','$http',function($scope,$http){
   $http.post('/here',{ data: 'something' }).success(
       function(data){
          $scope.datas=data;
       }
   )
  }]);

当我点击 url 时显示

http://localhost:3000/url/{{ data.name }}

如何在 onClick to 中显示数据的名称

http://localhost:3000/url/right_name

谢谢

Answer 1

如果您想以 Angular 进行重定向，您可以使用使用点击处理程序的“ng-click”或带有如下网址的“ng-href”的 2 个步骤中的任何一个：

<div>
<div ng-repeat="data in datas" title='{{ data.name }}' ng-click="redirect(data.name)" >{{ data.name }}</div><br/>
</div>

并在您的控制器范围内添加 redirect 函数

$scope.redirect = function (route) {
  $location.path('/' + route);
}

这种方法允许您通过更改参数使用相同的功能重定向到多个路由。

如果您只需要使用ng-href 指令进行重定向，则第二种方法是一种简单而优雅的方法：

<div>
  <div ng-repeat="data in datas" title='{{ data.name }}'>
    <a ng-href="/{{ data.name }}">{{ data.name }}</a>
  </div><br/>
</div>

Answer 2

使用ng-click 而不是onClick...

控制器

...
$scope.redirect = function(route) {
   $location.path('/' + route);
}
...

模板

<div>
    <div ng-repeat="data in datas" title='{{ data.name }}' ng-click="redirect({{ data.name }})" >{{ data.name }}</div><br/>
</div>

...或使用锚标记和ng-href。

<div>
    <div ng-repeat="data in datas" title="{{ data.name }}"><a ng-href="\{{ data.name }}">{{ data.name }}</a></div><br/>
</div>