swati kiran swati kiran - 4 months ago 20
AngularJS Question

How to use $scope values from Angular included files

In Angularjs using ng-include im facing some trouble...

Im having a single html form and including other html within it.

If this is my main.html..

<div ng-controller="appCtrl">
<div ng-include src="'/Tab1.html'"></div>
<!--trying to use one of the Tab1 field but unable to fetch -->
<button type="submit" ng-click=save()>Save</button>

in Tab1.html

<div ng-controller="appCtrl">
<input type="text" ng-model="data.name">
{{data.name}}<!--getting the value here-->

in my controller


.controller('appCtrl', ['$scope', '$http','$routeParams','$rootScope' ,'$location',
function($scope, $http, $routeParams, $rootScope ,$location){

$scope.save= function(){


Must be minior mistake but not known where...Thanks in advance for fixing!!


ng-include creates a child scope to acces the parent scope use $prarent

in Tab1.html

<input type="text" ng-model="$parent.data.name">
{{$parent.data.name}}<!--getting the value here-->