eigenharsha eigenharsha - 3 months ago 13
TypeScript Question

How to bind data in siblings through typescript


bind value in these tow siblings child1.controller.ts and
child2.controller.ts


/*
file :
index.html
|_app.ts
|_app.confing.ts (routing with parent.html and invoke parent controller)
|
|_parent.controller.ts
parent.html
|__ (invoke child1 Directive)
| |_child1.contoller.ts
| |_child1.html
|
|__(invoce child2 Directive)
|_child2.contoller.ts
|_child2.html

parent.html
<child1-tab></child1-tab>
<child2-tab></child2-tab>
*/



parent.controller.ts


module app.parent{
'use strict';
class ParentController {
static $inject = ["$scope"];
constructor(public $scope)
{
scope.status = "Parent Controller";
}
}
}



child1.controller.ts


/*child1-tab-Controller*/
module app.child1{
class child2Controller {
comingValue :string;
static $inject = ["$scope"];
constructor(public $scope){
this.comingValue = ""; //<= (I want to update it via child2.controller)
}
}
angular.module('myApp')
.controller('child1Controller', child1Controller);
}



child2.controller.ts


/*child2-tab-Controller*/
module app.child1{
class child2Controller {
newValue:string;
static $inject = ["$scope"];
constructor(public $scope){
this.newValue = "Send It to Child1"; //(newValue be send to child1Controller and set to the comingValue field in child1Controller)
}
}
angular.module('myApp')
.controller('child2Controller', child2Controller);
}



I want ot use a child2.controller->newValue to set the
child1.controller->comingValue

Answer

You can use two-way binding

<child1-tab my-model="vm.model"></child1-tab>
<child2-tab my-model="vm.model"></child2-tab>

or you can use angular event system

An another article about communication between directives in angular.