javascript - How to update view when loading data to model in angular? -

i have several <selects> updated every time object property on module changes value. problem comes when try remember state. save every change localstorage, when reasign saved object on window reload, model changes correctly view doesn't show change unless click on <select>, , when others supposed selected real values model.

i can see happens when load delayed timeout or event listener.

how can fix this?

var my_app = angular.module('campaign_listing', [])    .controller('campaign_list_controller', campaign_list_controller);    function campaign_list_controller($http) {    var este = this;    this.filters = {      categories: ["a"],    };      function get_save_state() {      var items = json.parse(localstorage.getitem("filters"));      return items;    }    this.recover_state = function() {        var save = get_save_state();      console.log("recovering state:")      if (save) this.filters = save;      }    settimeout(function() {      este.recover_state();    }, 300);  }

<select           id="multiselect_categories"           name="categories"           ng-model="ctrl.filters.categories"           ng-change="ctrl.update_fields()"           multiple="multiple">    <option value="a">a</option>    <option value="b">b</option>    <option value="c">c</option>  </select>

use angular's $timeout instead of settimeout, force new digest cycle update ui

$timeout(function() {     este.recover_state();   }, 300);