Question

我有一个已升级到1.6的Angular 1.3应用程序，现在有几个功能可以正常工作。

这些函数在一个vanilla JS脚本中调用，该脚本从控制器中调用，转发到另一个控制器并进行查看。

这是我的州： -

.state('track', {
    url: '/:area /:trackId /:type',
    parent: 'tracks',
    component: 'trackDetails'
})

这是我的vanilla JS脚本中的代码（使用第三方库（地图）来呈现实际视图）。

function getTrackLink(track) {
    trackLink = "<div><a ui-sref=\"tracks/track({area:" + track.area + " + /trackId:"
            + track.id + "/type:" + track.type + " })\">" + track.name
            + "</a></div>";

    console.log(trackLink);

    return trackLink;
}

这些链接无法点击，因此无法导航。在控制器中调用JS函数，在下面添加......

function MapCtrl($rootScope, $http, $stateParams, SearchOp, SearchResultsService, $state) {

const vm = this;

console.log('MapCtrl called');

console.log("stateParams:"+$stateParams);

vm.results = null;
vm.loading = true;

let latitude = 0;
let longitude = 0;
let distance = 0;
let currentZoom = 7;

if ($stateParams && typeof ($stateParams.latitude) !== 'undefined') {
    latitude = $stateParams.latitude;
    longitude = $stateParams.longitude;
    distance = $stateParams.distance;

    SearchResultsService.set(latitude, longitude, distance);

    $rootScope.searchPerformed = true;

} else if (!$rootScope.searchPerformed) {

    console.log("Defaulting co-ordinates to user's home town");
    latitude = $rootScope.currentLatitude;
    longitude = $rootScope.currentLongitude;
    distance = $rootScope.currentDistance;
    SearchResultsService.set(latitude, longitude, distance);

    $rootScope.searchPerformed = true;

} else {
    console.log('Rendering last search results');
}

console.log(`Search Params: ${latitude} : ${longitude} : ${distance}`);

SearchResultsService.get().then(data => {
    vm.loading = true;
    console.log(`Retrieved data from service: ${data}`);
    vm.results = data;
    loadMap(vm.results, currentZoom, $state);
    vm.loading = false;
}).catch(error => {
    vm.loading = false;
    vm.status = 'Unable to load trackdata: ' + error.message;
});


vm.search = (latitude, longitude, distance, currentZoom) => {

    vm.loading = true;

    SearchResultsService.set(latitude, longitude, distance);

    SearchResultsService.get().then(data => {

        console.log(`Retrieved data from service: ${data}`);
        vm.results = data;
        console.log("SearchResults"+ data);
        loadMap(vm.results, currentZoom);
        vm.loading = false;
    }).catch(error => {
        vm.loading = false;
        vm.status = 'Unable to load trackdata: ' + error.message;
    });

}

}

任何想法都赞赏.....

Answer 1

可能这是消毒的一个问题。你必须相信你的代码。小心翼翼。

看看这里：$sce

我认为你应该使用类似的东西：

<div ng-bind-html="vm.something"></div>

在控制器中

vm.something = $sce.trustAsHtml(vm.somethingUntrasted);

Answer 2

我在上面的代码中看不到从控制器调用getTrackLink函数的任何地方。但是作为解决方案，请尝试添加：

$rootScope.apply()

在调用getTrackLink函数之后。

如果函数是异步的，您可以尝试包装函数调用：

$rootScope.$apply(getTrackLink());

Angular JS - 从第三方回调函数调用角度

2 个答案: