Refreshing the View based on ng-model modifications in AngularJS

Question

Refreshing the View based on ng-model modifications in AngularJS

Is there a way to update an array linked to my ng-model after clicking a button without having to bind them? The issue arises because the data is being selected from a list. I want the data to be updated as soon as the button is clicked, without needing to change views or refresh the page.

Below is my HTML code, showing where the ng-model text should be updated:

'<span>HVACs: <ct-input  disabled="true"  ng-model="data.groupLimits[activeIndex].devices"  </ct-input> </span>' + '<br>' +
'<span> Add/Remove Device: <ct-input-list list="hvacsList"  ng-model="model"   </ct-input-list>' + '</span>' +
+ '<ct-button text="Add Device" show="true" ng-click="addDevice()"> </ct-button>'

javascript angularjs

Answer 1

Answer №1

When initially loading the array from a controller method call, simply execute that method again after completing any other tasks, for example:

In the controller:

$scope.LoadModel = function(){
    myService.loadModel(id).then(function(d){
        bindArrayToModel();
    })
}

$scope.DoClick=function(){
// do something
 $scope.LoadModel();   // reload model here
}

In the view:

Answer 2

When initially loading the array from a controller method call, simply execute that method again after completing any other tasks, for example:

In the controller:

$scope.LoadModel = function(){
    myService.loadModel(id).then(function(d){
        bindArrayToModel();
    })
}

$scope.DoClick=function(){
// do something
 $scope.LoadModel();   // reload model here
}

In the view:

Refreshing the View based on ng-model modifications in AngularJS

Answer №1

Similar questions

Angular image source load test encountered an error

Automatically submitting an HTML form from a JSP page

"Troubleshooting issue with jQuery failing to identify PHP variable within an if

The issue with line chart ticks not functioning properly in angularjs-nvd3-directives

What is the best way to ascertain if a specific string is included in the URL of another frame on my website?

Prevent the use of exponential notation with double numbers in GWT

Add a tab character within a textarea

Showcase the Uploaded Image Section within the Dropzone Display

Uh-oh! Angular 6 has encountered an unexpected error with template parsing

I am looking to use jQuery to update certain elements on the Cart details page to give it

Concealing overflow for text content through CSS styling

What is the best way to retrieve data from the state in react components?

Most effective method for sending information from an HTTP server to a browser client

Updating the database table using javascript

What is the best way to remove an entire span element that contains contenteditable spans within it?

React button synchronization issue with start stop functionality

Changing the Style of a CSS Module Using JavaScript

Inform the PHP backend that the browser has been closed by the frontend Angular application

Angular html5 mode failing to serve index.html via Express

When using .animate() to set the position, it takes precedence over manually assigning