14

AngularJSで条件付きでテキストをタグで囲む方法は? 例えば：

function Controller($scope){
  $scope.showLink = true or false, retrieved from server;
  $scope.text = "hello";
  $scope.link = "..."
}

{{showLink}} が false の場合

<div>hello</div>

そうしないと

<div><a href="{{link}}">hello</a></div>
4

5 に答える 5

15

ngSwitchはそれに適しています：

<div ng-switch="!!link">
    <a ng-href="{{link}}" ng-switch-when="true">linked</a>
    <span ng-switch-when="false">notlinked</span>
</div>
于 2013-05-16T05:37:34.587 に答える
11

私が知る限り、これを行うためのすぐに使える機能はありません。他の回答には満足できませんでした。なぜなら、あなたの見解で内部の内容を繰り返す必要があるからです。

これは、独自のディレクティブで修正できます。

app.directive('myWrapIf', [
  function()
    {
      return {
        restrict: 'A',
        transclude: false,
        compile:
          {
            pre: function(scope, el, attrs)
              {
                if (!attrs.wrapIf())
                  {
                    el.replaceWith(el.html());
                  }
              }
          }
      }
    }
]);

使用法：

<a href="/" data-my-wrap-if="list.indexOf(currentItem) %2 === 0">Some text</a>

「何らかのテキスト」は条件を満たした場合のみリンクとなります。

于 2014-12-19T15:54:49.927 に答える
3

試す

<div ng-show="!link">hello</div>
<div ng-show="!!link"><a href="{{link}}">hello</a></div>
于 2013-05-16T05:34:17.560 に答える
2

ng-switchディレクティブを使用できます。

<div ng-switch on="showLink">
    <div ng-switch when="true">
        <a ng-href="link">hello</a>
    </div>
    <div ng-switch when="false">
        Hello
    </div>
</div>
于 2013-05-16T05:34:37.513 に答える
1

AngularJS 式をサポートするための Casey の回答の修正版:

app.directive('removeTagIf', ['$interpolate', function($interpolate) {
  return {
    restrict: 'A',
    link: function(scope, el, attrs) {
      if (scope.$eval(attrs.removeTagIf))
        el.replaceWith($interpolate(el.html())(scope));
    }
  };
}]);

使用法：

<a href="/" remove-tag-if="$last">{{user}}'s articles</a>
于 2016-09-14T17:22:27.647 に答える