In my main html, I have a view which loads templates.
<div data-ng-view></div>
It loads a html whenever the link is clicked.
app.config(["$routeProvider", function ($routeProvider) {
'use strict';
$routeProvider
.when("/", {
templateUrl: "events.html"
});
}]);
On this page (template) , I have a directive which loads another html file
app.directive('ngPost', function () {
'use strict';
retu {
restrict: 'A',
templateUrl: 'postbox.html'
};
});
I then use this directive on my events.html page by using div data-ng-Post></div>
In postbox, I have two input fields and a button
<input type="text" id="user" data-ng-model="useame" />
<input type="text" id="mess" data-ng-model="message"/>
<button data-ng-click="Add(eventid-1, useame, message)">Post</button>
Upon clicking the button, I have some operations, then I try to clear the input fields, but I caot. Method here :
$scope.Add = function (index, uname, msg) {
//some operations here
$scope.message = ''; // clearing here
$scope.useame ='';
};
The clearing does not happen, I do not know why. My controller that has this Add method wraps the <div data-ng-view></div>in the main html file so it is the outermost controller and should have access to all $scope models inside. Why does it not work?