我已经写代码来显示装载机格,当任何资源是在之前,无论它是通过$ http.get或路由\ NG-观点得到.如果我变坏了,我不仅仅是信息......
flowHandler服务:
app.service('flowHandler', function(){
var count = 0;
this.init = function() { count++ };
this.end = function() { count-- };
this.take = function() { return count };
});
MainCTRL附加到 <body ng-controller="MainCTRL">
app.controller("MainCTRL", function($scope, flowHandler){
var _this = this;
$scope.pageTitle = "MainCTRL";
$scope.menu = [];
$scope.loader = flowHandler.take();
$scope.$on("$routeChangeStart", function (event, next, current) {
flowHandler.init();
});
$scope.$on("$routeChangeSuccess", function (event, next, current) {
flowHandler.end();
});
updateLoader = function () {
$scope.$apply(function(){
$scope.loader = flowHandler.take();
});
};
setInterval(updateLoader, 100);
});
和一些测试控制器通过$ …
我正在将自定义 Cordova 插件集成到 Ionic 应用程序中。我们让第 3 方创建了一个 Cordova 插件来与蓝牙设备连接。运行cordova platform ls显示插件已正确安装：
$ cordova plugin ls
> com.sitename.product 0.0.0 "DeviceProbe"
该插件包含一个probe.js文件，其中包含连接、读取、轮询和其他操作的方法。
/plugins/com.sitename.product/www/probe.js
var callNative = function(service, action, success, error, args) {
if(args === undefined) args = [];
cordova.exec(success, error, service, action, args);
};
var thermProbe = {
// Methods here
};
module.exports = thermProbe;
为了在我们的控制器中使用插件，我需要创建一个 Angular 服务包装器，如下所述。
我创建了一个工厂来处理这个问题。
/lib/probe/probe.js
(function() {
'use strict';
var serviceId = 'Probe';
angular.module('thermProbe').factory(serviceId, ['$q', Probe]);
function Probe($q) {
var service …angularjs cordova angular-services ionic-framework cordova-plugins
服务中有一些数据，当我将数据放在服务上的对象中时，它可以正常工作，但是现在我已经建立了数据库连接，所以数据再也无法到达组件了。
我希望该服务订阅从数据库返回的数据，并已定义如下调用：
public setPerson(ac: string): void{
console.log(ac);
this.generatePerson(ac).subscribe((data) => {
// this.mapPersonFromInput(data[0]);
console.dir(data);
});
}
该mapPersonFrominput()函数是对模拟数据的保留。它本质上与下面的extractData相同，但是来自代码中的静态对象。
generatePerson看起来像这样：
public generatePerson(id: string):Observable<Person>{
var datRetUrl: string = '/api/'
var fullUrl: string = datRetUrl + id;
return this.http.get(fullUrl)
.map(this.extractData)
.catch(this.handleError);
}
extractData只是将输入对象中的值分配给服务的对象结构，而handleerror只是将错误记录到控制台。
我通过从导航组件调用此函数来调用服务以在组件加载之前初始化组件的数据对象：
passCodeToService():void{
this.psn.setPerson(this.accessCode);
this.route.navigate(['/name']);
}
在应该获取数据的实际组件中，我正在使用ngOnInit，但是我认为我应该使用ngOnChanges来初始化该组件。这是我当前正在使用的代码，但是还没有运气修复。
ngOnInit() {
this.name =this.psn.getName();
console.log(this.name);
}
getName() 只需返回我存储在服务中的对象。
public getName(): Name{
return this.servicePerson.name;
}
我有一个服务全局存储我的应用程序中使用的所有数据.
angular
.module('app.core')
.service('GlobalDataService', GlobalDataService);
GlobalDataService.$inject = ['$http', 'LineStatusService'];
function GlobalDataService($http, LineStatusService) {
var gds = this;
gds.data = {
//all my data
}
gds.data.lines = LineStatusService.getLineStatus().then...
}
还有一个简单的crud服务来处理我的数据状态.
angular
.module('app.core')
.service('LineStatusService', LineStatusService);
LineStatusService.$inject = ['$http', 'GlobalDataService'];
function LineStatusService($http, GlobalDataService) {
var service = {
getLineStatus: getLineStatus,
saveLineStatus: saveLineStatus,
...
};
function saveLineStatus (line, status, user) {
var data = {
status: {
status_id: status.status_id,
status_desc: status.status_desc
},
updated_by: user
}
return $http.post('/api/euauto/v1/delivery-status/linestatus', data)
.then(function successCallback(response) {
GlobalDataService.data[id].status …我刚刚开始研究 Angular 4，我正在尝试将以 json 格式从 Angular 服务接收到的一些数据渲染到 Angular-datatable 中，但无论我尝试哪个选项，它都不适合我。表即将到来，列即将到来，但列内的数据未显示。
任何帮助都会很棒，
提前致谢..！！！！
请在下面找到我的代码：
组件.html
<table datatable [dtOptions]="dtOptions" class="row-border hover"></table>
组件.ts
import { Component, OnInit } from '@angular/core';
import { FleetDataService } from '../../services/fleet-data.service';
import { Subject } from 'rxjs/Subject';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent implements OnInit {
private fleetData: any;
dtOptions: DataTables.Settings = {};
dtTrigger: Subject<any> = new Subject();
constructor(private getFleetData:FleetDataService) { }
ngOnInit() {
this.getFleetData.getFleetData().subscribe(
fleetData => {
this.fleetData = fleetData;
console.log(this.fleetData);
this.dtTrigger.next();
}, …我的应用程序中关于服务的结构如下-
AppModule (AppComponent and HomeComponent)
| | |
Lazy1 Lazy2 Lazy3
我的应用程序从 AppComponent 开始，它重定向到 HomeComponent，然后重定向到子模块之一。
所有子模块都是延迟加载的。现在我从 AppComponent 开始，从那里我被重定向到子模块之一。现在根据某些条件，我导航回 HomeComponent，然后再次重定向到子模块之一。
我的问题是，如果我再次使用不同的数据重新加载任何子模块，那么该子模块的服务也将具有相同的旧数据。本质上，由于儿童注射，这些服务并没有像它们应该的那样重新创建。
需要帮助来确定这里的问题。
附加信息 -
我在 AppModule 中有一些 App 级别的常用服务。然后每个子模块都有许多该模块使用的服务。应用级服务被注入到子模块服务中。
我是角度新手，我尝试构建一个小型应用程序。我有一个包含变量和函数的服务：
data = [];
getData() {
this.http.get(url).subscribe((res)=>
this.data.push(res));
};
我也有两条路线：
import { DataService } from './data.service';
// ...
const appRoutes = [
{ path: 'home', component: HomeComponent },
{ path: 'settings', component: SettingsComponent }
]
@NgModule({
// ..
providers: [DataService],
// ..
})
当我在 homeComponent 中使用 getData 函数时，它工作正常，并且响应被添加到数据数组中。但是 - 这就是问题 - 一旦我导航到第二条路线，服务中的数据又恢复为空数组。
我本以为当我导航时该服务不会“重新启动”。
那么，问题出在哪里呢？谢谢。
我的 Angular 7 应用程序中有以下应用程序结构：
AppModule
DashboardModule
DashboardChild1
DashboardChild2
DashboardChild3
DashboardService
AdminModule
AdminChild1
AdminChild2
AdminChild3
我想有只在DashboardService DashboardModule，所以我跟着这个链接providedin-和ngmodules。
这是我的DashboardService：
import { Injectable } from '@angular/core';
import { DashboardModule } from './dashboard.module';
@Injectable({
providedIn: DashboardModule
})
export class DashboardService {
.......
}
我在 DashboardChild1 组件中使用了该服务，但出现以下错误：
检测到循环依赖项中的警告：src/app/dashboard/dashboard-child1/dashboard-child1.component.ts -> src/app/dashboard/dashboard.service.ts -> src/app/dashboard/dashboard.module.ts - > src/app/dashboard/dashboard-routing.module.ts -> src/app/dashboard/dashboard-child1/dashboard-child1.component.ts
检测到循环依赖项中的警告：src/app/dashboard/dashboard-routing.module.ts -> src/app/dashboard/dashboard-child1/dashboard-child1.component.ts -> src/app/dashboard/dashboard.service。 ts -> src/app/dashboard/dashboard.module.ts -> src/app/dashboard/dashboard-routing.module.ts
检测到循环依赖项中的警告：src/app/dashboard/dashboard.module.ts -> src/app/dashboard/dashboard-routing.module.ts -> src/app/dashboard/dashboard-child1/dashboard-child1.component。 ts -> src/app/dashboard/dashboard.service.ts -> src/app/dashboard/dashboard.module.ts
检测到循环依赖项中的警告：src/app/dashboard/dashboard.service.ts -> src/app/dashboard/dashboard.module.ts …
我有一个名为的组件，customers-list我在其中显示 API 中的所有客户：
客户列表.html
<div *ngFor="let customer of customers">
<p>{{customer.name}</p>
</div>
客户列表.ts
import { Component Input} from '@angular/core';
import { ICustomer} from 'src/app/models/app.models';
import { CustomersService } from 'src/app/services/customers.service';
@Component({
selector: 'drt-customers-list',
templateUrl: './customers-list.component.html',
styleUrls: ['./customers-list.component.scss'],
})
export class CustomerListComponent {
public customers: ICustomer[] ;
constructor(public customersService: CustomersService,) {}
public async ngOnInit(): Promise<void> {
this.customers = await this.customersService.getCustomersList('');
}
}
我有另一个名为 的组件add-customer，我将在其中添加新客户，如下所示：
public onaddCustomer(): void {
this.someCustomer = this.addCustomerForm.value;
this.customersService.addCustomer( this.someCustomer).subscribe(
() => { // If …是否有办法防止服务被注入到其原始模块之外？
假设我们正在projects.module.ts延迟加载并ProjectsModule导入ProjectsStoreModule. 我定义了一个服务ProjectsStoreModule，我不想将其注入到 中ProjectsModule，但可以将其注入到 中的任何位置ProjectsStoreModule。我想知道是否有办法实现这一目标？
注意： ProjectsStoreModule没有任何组件，因此我无法向组件提供服务。我想要隔离的服务将被注入到 Ngrx Effect 中，这是一个服务。
我做了什么：
我注册了ProjectsService：
@Injectable({
providedIn: ProjectsStoreModule
})
export class ProjectsService {
...
}
项目模块：
@NgModule({
...
})
export class ProjectsModule {
...
imports: [ProjectsStoreModule]
}
这种做法显然引起了如此多的Circular dependency警告。
ProjectsService然后我尝试在装饰器中注册@NgModule：
@NgModule({
...
providers: [ProjectsService]
})
export class ProjectsStoreModule {
...
}
现在的问题是，通过将 导入ProjectsStoreModule到 中ProjectsModule，我想要成为内部服务的服务将在 中可用ProjectsModule。
任何帮助将不胜感激。
dependency-injection lazy-loading angular-services angular-module angular
angular-services ×10
angular ×7
angularjs ×3
typescript ×2
angular6 ×1
cordova ×1
javascript ×1
json ×1
lazy-loading ×1
ngonchanges ×1
ngoninit ×1