Question

我正在开发angularJS，我想创建一个通用的警报功能，所以我可以在所有控制器中使用它来进行验证和其他目的。

我的服务是，

JodoModule.service("CommonSrv", function ($rootScope) {
this.showAlert = function (message, status) {
    $rootScope.alertMessage = message;
    $rootScope.showAlert = status;
}
this.hideAlert = function () {
    $rootScope.showAlert = false;
}

}）

ControllerOne，

$rootScope.CommonSrv = CommonSrv;
    CommonSrv.showAlert("No notifications available", true);

ControllerTwo，

$rootScope.CommonSrv = CommonSrv;
    CommonSrv.showAlert("No data available", true);

控制器呼叫服务，我能够在屏幕上看到警报div内容

我的观点是，

<div ng-show="showAlert" class="alertCustom">
    <label>{{alertMessage}}</label>
    <br /><br />
    <a ng-click="CommonSrv.hideAlert()" class="btn btn-warning  btn-sm">
        &nbsp; <span style="color:brown; font-weight:bold">OK</span> &nbsp;
    </a>
</div>

在这里，我创建了一个通用模板，我正在分配“alertMessage”和“showAlert”，它工作正常。但我应该写的代替 “??? whichName ???”控制器。

因为我想从不同的控制器使用相同的服务。但是当我调用“hideAlert（）”动作时，它需要去哪里执行？

我们无法在ng-Controller目录中编写serviceName。

那么我需要在代码中进行哪些更改才能使其正常工作？

Answer 1

如果您想保留$rootScope中的所有内容，也可以将其添加到您的服务中：

$rootScope.CommonSrv = CommonSrv;

然后，您可以直接从HTML中的此服务访问hideAlert，您不需要任何ng-controller。这是模板：

<div ng-show="showAlert" class="alertCustom">
    <label>{{alertMessage}}</label>
    <br /><br />
    <a ng-click="CommonSrv.hideAlert()" class="btn btn-warning  btn-sm">
        &nbsp; <span style="color:brown; font-weight:bold">OK</span> &nbsp;
    </a>
</div>

为了保持清洁，我建议将alertMessage和showAlert保留在此服务中而不是在根范围内，然后变为：

JodoModule.service("CommonSrv", function ($rootScope) {
  this.showAlert = function (message, status) {
    this.alertMessage = message;
    this.showAlert = status;
  }

  this.hideAlert = function () {
    this.showAlert = false;
  }
})

HTML：

<div ng-show="CommonSrv.showAlert" class="alertCustom">
    <label>{{CommonSrv.alertMessage}}</label>
    <br /><br />
    <a ng-click="CommonSrv.hideAlert()" class="btn btn-warning  btn-sm">
        &nbsp; <span style="color:brown; font-weight:bold">OK</span> &nbsp;
    </a>
</div>

如何在angularjs中创建警报的通用功能

1 个答案: