I have a partial view, which I plan to include in different pages.
I tried out the following to load the partial view but the view doesn't display the values stored in the model.
Angular controller:
//This gets the required data as JSON AdminService.getSettings(function (callback) { $scope.attributes = callback; $scope.groups = _.groupBy($scope.attributes, "Group"); $scope.previous = angular.copy($scope.attributes); //This gets the partial view and adds to the main view CommonService.SettingsListView_get(function (callback) { angular.element('#settingsList').html(callback); }); }); MVC Controller:
public ActionResult SettingsList() { return PartialView(); } View: Main
<body ng-app="AngularAdmin" ng-cloak> <div ng-controller="SettingsCtrl" id="top" ng-init="init()"> <br /> <div id="settingsList" > </div> View:partial
<div class="panel-group" id="accordion"> <div style="padding:5px 0"><button ng-click="updateAttributes(attributes)" class="btn btn-primary"><span class="glyphicon glyphicon-floppy-disk"></span> Update Settings</button></div> <div class="panel panel-primary" data-ng-repeat="(items, item) in groups" ng-style="$index < 11 ? panelStyle[$index] : commonPanelStyle"> <div class="panel-heading" ng-style="$index < 11 ? panelHeaderStyle[$index] : commonPanelHeaderStyle"> <a data-toggle="collapse" href="#accordion{{$index}}" ng-style="anchorStyle"> <h4 class="panel-title"> {{ items }} </h4> </a> </div> <div id="accordion{{$index}}" class="panel-collapse collapse"> <div class="panel-body" ng-style="$index < 11 ? panelBodyStyle[$index] : commonPanelBodyStyle"> <table class="table"> <tr> <th>Attribute</th> <th>Description</th> <th>Value</th> <th>Taken from</th> <th>Editable</th> <th>Delete</th> </tr> <tr data-ng-repeat="i in item"> <td> {{ i.AttributeName }} </td> <td> {{ i.Description }} </td> <td> <input type="text" ng-model="i.Value" class="form-control" ng-disabled="{{!i.Editable}}" /> </td> <td><span ng-bind="i.TakenFrom | settingsfilter">{{ Heritage }}</span> </td> <td><span ng-class="i.Editable | activefilter : { icon1 : 'glyphicon-edit', icon2 : 'glyphicon-remove'}" class="glyphicon" style="font-weight: bolder"></span></td> <td><span ng-click="deleteAttribute(i.AttributeGuid)" ng-class="i.TakenFrom | deletefilter : 1" class="glyphicon" style="font-weight: bolder"></span></td> </tr> </table> <button style="float:right" class="btn btn-default" ng-click="updateAttributes(item)"><span class="glyphicon glyphicon-floppy-disk"></span> Update <em>{{ items }}</em> Settings </button> </div> </div> Issue: I can't display the settings data I can see {{ items }} and nothing else in the view.
