Angular 如何从角度设置服务的输入模型值？

这里的问题是如何设置Angular 2中服务的输入模型值

这是我的示例代码：
组成部分：

//our root app component
import {Component} from 'angular2/core'
import {Service} from './service'

@Component({
  selector: 'my-directive',
  providers: [],
  template: `<input [(ngModel)]="abc">`,
  directives: []
})
export class Directive {
  constructor(public service: Service) {
    this.abc = this.service.value;
  }
}

---

问题在于，服务和控制器中的值有不同的实例。如果您在服务中更改

值

，您只会更改那里的实例，控制器的实例仍然是旧实例。反过来也是一样的。可以通过将字符串存储在这样的对象中来解决此问题

@Injectable()
export class Service {
  data = { value: '' };
  constructor() {
    this.data.value = "service"
  }
}

@Component({
  selector: 'my-directive',
  providers: [],
  template: `<input [(ngModel)]="abc.value">`,
  directives: []
})
export class Directive {
  constructor(public service: Service) {
    this.abc = this.service.data;
  }
}

@Injectable（）
出口类服务{
数据={值：'}；
构造函数（）{
this.data.value=“服务”
}
}
@组成部分({
选择器：“我的指令”，
提供者：[]，
模板：``，
指令：[]
})
出口类指令{
建造商（公共服务：服务）{
this.abc=this.service.data；
}
}

另一个解决方案是设置与可观察对象的通信，如图所示

@Injectable（）
出口类服务{
valueSource=新主题（）；
value$=this.valueSource.asObservable（）；
updateValue（值：字符串）{
this.valueSource.next（值）；
}
}
@组成部分({
选择器：“我的指令”，
提供者：[]，
模板：``，
指令：[]
})
出口类指令{
值：字符串；
建造商（公共服务：服务）{
this.service.value$.subscribe（value=>this.value=value）；
}
}

试试这个：

component.html

<input type="text" [(ngModel)]="abc">

组件服务.ts

private abc: string;

constructor(
        public homeService: HomeService
    ) { }
ngOnInit() {
        this.abc = this.homeService.value;
    }

public value: string;

constructor(private http: Http) { 
        this.value = "Hello world";
    }

---

\u abcService

是否返回了您想要存储在

中的内容。modal

？我需要在getList方法中更新abcService中的模型。请提供服务和组件代码。我们有一个特定的场景，这就是为什么我们需要更新该服务本身的值。看起来您缺少导入或指令。[（ngModel）]把一切都搞糟了

private abc: string;

constructor(
        public homeService: HomeService
    ) { }
ngOnInit() {
        this.abc = this.homeService.value;
    }

public value: string;

constructor(private http: Http) { 
        this.value = "Hello world";
    }