CODEWITHSUNDEEP
angularjsionic-framework
Juan Carlos Leon
Juan Carlos Leon

Reputation: 43

Ionic pass from controller variable to page

Hello I'm doing an hybrid app using Ionic Framework, but I think my mistake it's more from angular.

I got this view:

<ion-view class="back" ng-controller="webCtrl" view-title="{{tipo[id].title}}">
    <ion-content>
      <ion-list>
        <div ng-controller="WebminarsCtrl">
          <div ng-repeat="group in groups">
            <ion-item class="item-dark" ng-click="toggleGroup(group)" ng-class="{active: isGroupShown(group)}">
              <i class="icon" ng-class="isGroupShown(group) ? 'ion-minus' : 'ion-plus'"></i>
                &nbsp;
                {{group.name}}
            </ion-item>
            <ion-item menu-close class="item-accordion" ng-repeat="item in group.items" ng-show="isGroupShown(group)">
              <p ng-bind-html="item.mapa"></p>
              <p ng-bind-html="item.contenido"></p>
            </ion-item>
          </div>
        </div>
      </ion-list>
    </ion-content>
  </ion-view>

But the ng-bind-html isn't working, in my controller I had this:

.controller('WebminarsCtrl', function($scope, $state) {
  $scope.id = $state.params.id;
  $scope.groups = [];

  $scope.groups[0] = {
    name: 'Tec de Monterrey',
    items: []
  };

  $scope.groups[0].items[0] = {
    contenido:'Horarios',
    mapa: '<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3764.2253262010768!2d-99.26264758551588!3d19.359393748034964!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x85d200c0fa04d82b%3A0x5e726f97d5cf3c8b!2sTecnol%C3%B3gico+de+Monterrey+Campus+Santa+Fe!5e0!3m2!1sen!2smx!4v1459638056684" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>'
  };
})

And the the view doesn't display the map that the variable had, but the contenido variable it's working without problems.

Any help will be appreciated.

Upvotes: 0

Views: 458

Answers (1)

Konkko
Konkko

Reputation: 662

Add angular-sanitize.js Angular sanitize / ng-bind-html not working?

If that doesn't help then try using $sce.trustAsHtml as a filter $sce

Easy example how to use it with out making a filter https://stackoverflow.com/a/18342738/5136207

Upvotes: 2

Related Questions