我今天下午一直在寻找如何使用Typescript来改变我的痕迹路径中的span元素的html,或者在jQuery选择器中获取一个angular语句来评估/编译。我发现最接近的是使用$ compile,但我不确定这是否可行,因为在我的解析完成之前我没有数据?如果愿意的话,我需要一手了解将$ compile注入应用程序的位置。
index.module.ts
angular.module('pccrm', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ngMessages', 'ngAria', 'ngResource',
'ui.router', 'ui.bootstrap', 'feature-flags', 'trNgGrid', 'pascalprecht.translate', 'toastr', 'cgBusy',
'fixtable', 'angularUtils.directives.uiBreadcrumbs', 'LocalStorageModule'])
...
index.route.ts
...
.state(Constants.SEARCH_CONTACTS_CONTACTPROFILE, {
url: '/orgs/:externalOrgId/contacts/:profileId',
data: {
displayName: 'Contact Profile'
},
views: {
'': {
templateUrl: 'app/contacts/contact-profile.tmpl.html',
controller: 'ContactsProfileController',
controllerAs: 'cpc',
resolve: {
contactProfile: function (contactProfileService: IContactProfileService, $stateParams: any) {
return contactProfileService.getContactProfile(<string>$stateParams.externalOrgId, <string>$stateParams.profileId)
.then(function (contactModel: IContact) {
return contactModel;
});
}
}
}
}
})
...
与-profile.tmpl.html
...
<div class="info-group">
<div class="profileImage default">
</div>
<h4 class="contact-name">{{ cpc.contactProfile.fullName() }}</h4>
{{ cpc.contactProfile.title }}<br/>
<a ui-sref="search.organizations.orgProfile({externalOrgId: cpc.contactProfile.externalOrganizationId })" ng-if="cpc.contactProfile.externalOrganizationId">
{{ cpc.contactProfile.externalOrganizationName }}
</a>
</div>
...
有点类似......
<script type="text/javascript">
$('.breadcrumb li.active span').html(
$compile("{{ cpc.contactProfile.fullName() }}")(scope));
</script>
在模板html的最后这样做的最佳方法是什么?或者我的个人资料服务一旦检索到联系信息就能以某种方式编辑DOM?
注意我们正在使用angular-util-sui-breadcrumbs生成BCT ...目前不支持使用我们嵌套的命名视图将解析插入到BCT中。这就是我需要能够在事后修改BCT dom的原因。
答案 0 :(得分:0)
或者我的个人资料服务一旦检索到联系信息就可以以某种方式编辑DOM
是。导出范围上的内容并在UI中使用{{somethingOnScope.contactProfile.fullName()}}
。
有关范围的更多信息:https://docs.angularjs.org/guide/scope
您可能误解了我的问题
没有。我说不要这样做:
$('.breadcrumb li.active span').html(
$compile("{{ cpc.contactProfile.fullName() }}")(scope));
相反,你的HTML应该是这样的:
<ul class="breadcrumb">
<li class="active">
<span>{{somethingOnScope.contactProfile.fullName()}}</span>
</li>
</ul>
然后你不需要jquery