angular.js将数据从父级传递给子组件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script src="https://unpkg.com/angular@1.7.3/angular.js"></script>
<body ng-app="app">
<parent-component></parent-component>
<body>
<script type="text/javascript">
var app=angular.module("app",[]);
app.component("parentComponent", {
template: `
<fieldset>
Inside parent component<br>
parentData={{$ctrl.parentData}}
<child-component in-data="$ctrl.parentData"></child-component>
</fieldset>
`,
controller: function () {
this.$onInit = () => {
this.parentData = '父组件的值'
};
},
})
app.component("childComponent",{
bindings: {
inData: '<',
},
template: `
<fieldset>Inside child component<br>
inData={{$ctrl.inData}}
</fieldset>
`,
})
</script>
</body>
</html>
1230博客
热门推荐：