Question

我有一个值为

的递归变量

path = <d:URL>http://www.google.com, Google</d:URL>

我想将此路径绑定到角度组件。我正在尝试使用以下方法绑定ng-href值。

<a ng-href="{{path.URL.split(",")[0]}}" target="_blank">{{path.URL.split(",")[1]}}</a>

这似乎打破了href但是分割得到了链接标题的评估。我该如何解决这个问题。

感谢。

Answer 1

您可以创建一个功能来执行拆分功能。所以试试这个

<强> HTML ：

 <a ng-href="{{createURL()}}" target="_blank">{{path.URL.split(",")[1]}}</a>

<强> JS

$scope.createURL=function(path){
  return path.URL.split(",")[0]
}

Answer 2

创建一个函数并执行拆分操作

  $scope.getSplitVal = function(url){
     return url.split(",")[1]
  }

＆＃13;

angular.module("app",[])
.controller("ctrl",function($scope){
  $scope.path = "<d:URL>http://www.google.com, Google</d:URL>"

  $scope.getSplitVal = function(url){
     return url.split(",")[1]
  }
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
 <a ng-href="{{getSplitVal(path)}}" target="_blank">{{getSplitVal(path)}}</a>

</div>

＆＃13;

Answer 3

我认为你需要对控制器进行任何字符串操作，而不是HTML。这不是好习惯。

字符串"<d:URL>http://www.google.com, Google</d:URL>"应该转到：

var path = "<d:URL>http://www.google.com, Google</d:URL>";

 $scope.path = {
   URL:{
     value:path.split(",")[0].replace("<d:URL>", ""),
     name: path.split(",")[1].replace("</d:URL>", "")
   }
 };

因此，您的HTML将如下所示：

<a ng-href="{{path.URL.value}}" target="_blank">{{path.URL.name}}</a>

Answer 4

由双引号引起的问题，当输出html但未通过角度处理时，它会突破ng-href并且变为：

ng-href="{{path.URL.split("

只需将split内的双引号更改为单引号：

<ul ng-controller="PathsController as $ctrl">
  <li ng-repeat="path in $ctrl.paths">
    <a 
      ng-href="{{ path.URL.split(',')[0].replace('<d:URL>', '') }}"
    >
      {{ path.URL.split(",")[1].replace('</d:URL>', '') }}
    </a>
  </li>
</ul>

使用Split方法的Angular ng-href

4 个答案: