Question

我正在将CacheService与包含许多下拉值的搜索屏幕一起使用。仅当您将缓存设置为一个下拉菜单时，此方法才有效；如果您将缓存设置为多个（即使它们具有不同的键），则它将不起作用。我想我需要创建一个新的缓存服务实例

示例：

constructor(private _appParams: AppParamasService,private _cacheService: CacheService) {
}

getUserLocations(ID: string, allList: string) {
        let userLocationsCache: string;

        let res: any | null = this._cacheService.get(userLocationsCache);
        if (res) {
            this.results = res;

        }
        else {

            this._appParams.getUserLocations(ID, allList)
                .subscribe(
                data => {
                    this.results = data.result;
                    this._cacheService.set(userLocationsCache, data.result);    

                },
                error => this.showMessage(' Method: ' + <any>error, 0));


        }
}

    getAllStatuses() {
        let statusCache: string="";

        let res1: any | null = this._cacheService.get(statusCache);
        if (res1) {
            this.iStatuses = res1;
                  }
        else {

            this._appParams.getStatuses()
                .subscribe(
                data => {
                    this.iStatuses = data.result;
                    this._cacheService.set(statusCache, data.result);    
                },
                error => this.showMessage(' Method: ' + <any>error, 0));

        }
}

错误

错误TypeError：无法读取未定义的属性'toString'

*************************************************** **更新*********************************************** ******* 我从应用程序模块中取出CacheService并在组件级别添加了声明。.仍然无法正常工作

import { CacheService } from 'ng2-cache-service';
@Component({
    selector: 'search',
    moduleId: module.id,
    templateUrl: 'search.component.html',
    providers: [CacheService]

})




export class SearchComponent implements OnInit {
constructor(private _appParams: AppParamasService,private _cacheService: CacheService) {
}

getUserLocations(PNSLUID: string, allList: string) {
        let userLocationsCache: string;

        let res: any | null = this._cacheService.get(userLocationsCache);
        if (res) {
            this.results = res;

        }
        else {

            this._appParams.getUserLocations(ID, allList)
                .subscribe(
                data => {
                    this.results = data.result;
                    this._cacheService.set(userLocationsCache, data.result);    

                },
                error => this.showMessage(' Method: ' + <any>error, 0));


        }
}

    getAllStatuses() {
        let statusCache: string="";

        let res1: any | null = this._cacheService.get(statusCache);
        if (res1) {
            this.iStatuses = res1;
                  }
        else {

            this._appParams.getStatuses()
                .subscribe(
                data => {
                    this.iStatuses = data.result;
                    this._cacheService.set(statusCache, data.result);    
                },
                error => this.showMessage(' Method: ' + <any>error, 0));

        }
}

ts服务

import { environment } from 'environments/environment';

@Injectable()

export class AppParamasService {

    constructor(private _http: Http) {

    }

 getStatuses() {
         return this._http.get(environment.BASE_API_URL + 'GetAllStatuses/')
             .map((response: Response) => response.json())
             .catch(this.handleError);

     }
 getUserLocations(a: string, allList: string) {
         return this._http.get(environment.BASE_API_URL + 'GetUserLocations/' + a + '/' + allList)
             .map((response: Response) => response.json())
             .do(data => console.log('loctions ' + JSON.stringify(data)))
             .catch(this.handleError);
     }

Answer 1

如果您只是将服务（或任何@Injectable）注入到构造函数中，Angular将会遍历组件/模块树并为您的服务寻找提供者。您很有可能已将服务添加到模块的providers数组中。这将导致一个单例服务，在您将此服务注入此模块中的任何地方都将使用该服务。

如果您确实想为组件使用服务的独立实例，则可以将服务添加到组件的providers数组，如下所示：

@Component({
  selector: 'my-component',
  templateUrl: './my-component.component.html',
  styleUrls: [ './my-comppnent.component.css' ],
  providers: [CacheService]
})
export class MyComponent {
...

角创建CacheService的新实例

1 个答案: