AngularJS : 在视图中显示来自服务的参数

Question

我如何构建一个可以从我需要的任何地方使用自定义参数调用的服务。

我有这个代码：

.service('loadingService', function($ionicLoading) {
    this.showLoading=function(textToBeDisplayed){
        $ionicLoading.show({
          noBackdrop: false,
          templateUrl: 'templates/loading-template.html'
        });
    };
    this.hideLoading=function(){
        $ionicLoading.hide();
    };  
});

查看：（加载中-template.html）

<div>{{textToBeDisplayed}}<ion-spinner icon="ios"/></div>

控制器：

loadingService.showLoading('loading all data');

显示正在加载，但 "textToBeDisplayed" 在视图中不可见。
有什么想法吗？

谢谢

Answer 1

我认为您的服务应该使用 template，因为您正在传递模板内容

.service('loadingService', function($ionicLoading) {
    this.showLoading=function(textToBeDisplayed){
        $ionicLoading.show({
          noBackdrop: false,
          template: '<div>'+textToBeDisplayed+'<ion-spinner icon="ios"/></div>'
        });
    };
    this.hideLoading=function(){
        $ionicLoading.hide();
    };  
});

Answer 2

只需这样做：

.service('loadingService', function($rootScope) {
    return function(textToBeDisplayed) {
        $rootScope.textToBeDisplayed = textToBeDisplayed;
        //put whatever else you want here.
    }
});

在你的控制器中这样调用它：

loadingService('someText');

将此绑定放入您的 HTML:

{{textToBeDisplayed}}

不要忘记将服务注入到您需要从中访问它的任何控制器中。

plnkr: http://plnkr.co/edit/n1LdDAG8k9C1JC7qBDyM?p=preview

AngularJS : 在视图中显示来自服务的参数

AngularJS : display param from a service in a view

angularjs

angular-services

ionic-framework