ui-sref 在从属性文件加载锚标记时无法正常工作

Question

属性文件中的条目

MYKEY= <a ui-sref="mystate.state">Go to my page using state</a> and <a href="/#/mypage/page">Go to my page using link/a>

我已从属性文件中获取此密钥并对其应用 $sce.trustAsHtml() 并在 html 中使用。我可以看到 的 link 使用 link 转到我的页面，但是 使用 state 转到我的页面无法正常工作，因为它有 ui-sref 标签。有人可以指定它不起作用的原因和解决方案。

注意：ui-sref直接在html中使用时在我的项目中工作正常。

Answer 1

可能是因为内容没有编译，所以ui-sref没有生效

我发现了下面编译和插入 html 代码的指令，请检查这是否解决了您的问题！

指令是从这个SO Answer

得到的

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

app.controller('MyController', function MyController($scope) {
  $scope.test = function() {
    console.log("it works!");
  }
  $scope.html = '<a ui-sref="mystate.state">Go to my page using state</a> and <a href="/#/mypage/page">Go to my page using link</a><button ng-click="test()">click</button>{{asdf}}';
});

app.directive('compile', ['$compile', function ($compile) {
    return function(scope, element, attrs) {
        scope.$watch(
            function(scope) {
                // watch the 'compile' expression for changes
                return scope.$eval(attrs.compile);
            },
            function(value) {
                // when the 'compile' expression changes
                // assign it into the current DOM
                element.html(value);
                // compile the new DOM and link it to the current
                // scope.
                // NOTE: we only compile .childNodes so that
                // we don't get into infinite loop compiling ourselves
                $compile(element.contents())(scope);
            }
        );
    };
}])

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-controller='MyController' ng-app="myApp">
  <div compile="html"></div>
</div>

ui-sref 在从属性文件加载锚标记时无法正常工作

ui-sref not working properly when anchor tag is loaded from properties file

angularjs

angularjs-directive

angular-ui-router