javascript - 如何在 Angular JS 中使用指令。在我的情况下不起作用,为什么?

标签 javascript angularjs angularjs-directive ionic-framework ionic-view

我需要用点击函数绑定(bind)打印动态html。我已经使用 $sce.trustAsHtml 分配给范围变量。以下是我的代码供引用。我无法找到为什么指令在我的情况下不起作用。请帮我解决这个问题。

app.js

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])
    .config(function($stateProvider, $urlRouterProvider) {
        .state('groupchat', {
          url: '/groupchat',
          templateUrl: 'templates/groupchat.html',
          controller: 'GroupChat',
          controllerAs: 'GC'
        })
    })
    .run(function($rootScope, $location, SharedProperties) {
      SharedProperties.sharedObject = {
        unread: 0,
        subscriptions: [],
      }
    });

groupchat.js//- Controller

angular.module('starter.controllers')
.directive('dynamic', function ($compile) {
    return {
        restrict: 'A',
        replace: true,
        link: function (scope, ele, attrs) {
          scope.$watch(attrs.dynamic, function(html) {
            ele.html(html);
            $compile(ele.contents())(scope);
          });
        }
      };
    })
.controller('GroupChat', function($rootScope, $scope, $sce, $compile) {  
    $scope.trustedHtml = $sce.trustAsHtml('<span ng-click="testAlert()">Submit</span>');  
    $scope.testAlert = function () {
        alert('testing');
    };
});

groupchat.html

<ion-view>
    <div dynamic="trustedHtml"></div>
</ion-view>

最佳答案

<div dynamic= "{{trustedHtml}}"> ??

我想如果这是问题所在,它会绑定(bind)字符串“trustedHtml”而不是 hte var 内容,并且在您的情况下它仍然可以工作/显示

关于javascript - 如何在 Angular JS 中使用指令。在我的情况下不起作用,为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37281102/

相关文章:

javascript - 输入中的 Angularjs ng-model 不会更新 Controller 中的值

javascript - 每篇文章都有一个单独的链接(bootstrap modal、django、jQuery)

javascript - 未知提供者 : $scopeProvider

javascript - 如何检测所有http GET失败?

javascript - 按下按钮时触发点击事件

javascript - Rails 在使用 cocoon 字段渲染表单时转义 javascript

javascript - 重置变换: rotate() by removing and appending canvas not showing data after appending and redrawing chart

javascript - AngularJS watch 没有被触发

angularjs - 如何在angularjs中显示带有小数部分的数字

jquery - 无法将焦点设置在 Excel 加载项中的 ui-ace 上