时间戳

首页 > 解决方案 > AngularJS - 如何动态更改组件控制器？

javascript - AngularJS - 如何动态更改组件控制器？

问题描述

我有一个 angularJS 组件，我手动设置了链接的 url。但是我想在以不同的方法加载博文后更改此 url。

HTML：

<a ng-href="{{ $ctrl.readMoreUrl }}" id="readMore" class="read-more" translate="READ_THE_POST" >
READ MORE ON THE BLOG<img src="../../images/assets/arrow-right.svg" 
class="img-responsive arrow-right" alt=""/></a>

Javascript：

function BlogDetailController() {
    var ctrl = this;
    ctrl.readMoreUrl = 'https://mytest-site.com/blogpost/superpost/';
}

    var angularApp = angular.module(

    .component('postDetail', {
        templateUrl: '/javascripts/controllers/blogDetail.html',
        controller: BlogDetailController,
        bindings: {post: '=', indx: '=', title: '='}
    })

我想用不同的功能改变它：

$scope.loadpost = function () {
    //I want to change the url here
}

我尝试向“readMore”的 id 添加一个简单的事件监听器。但有时它有效，有时它不是......而且我认为这不是更改网址的最佳方式。所以我的问题是，在组件开始使用控制器后，如何随时更改 url？

标签： javascriptangularjsangularjs-controllerangularjs-components

解决方案

您是否尝试过将 img 源与 ng-src 连接？ https://www.aspsnippets.com/Articles/Dynamically-change-SRC-of-Image-in-AngularJS.aspx

推荐阅读