Currently, I am retrieving data from a Drupal service and using AngularJS along with the ionic framework to create a hybrid app for mobile platforms, leveraging Cordova or Phonegap. You can check out my code on codepen: http://codepen.io/BruceWhealtonSWE/pen/PqOZeV
In retrospect, I realize that utilizing script tags to store partial views would have been more suitable as the about page displayed in the html view seems off. Within my codebase, the index.html file significantly reduces the size of the about.html file.
The key portion of the code is within the app.js file, particularly the controller marked below.
.controller('AboutController', ['$scope', '$http', '$state', function($scope, $http, $state) {
$http.get('http://toptenbooks.net/api/v1/node/6').success(function(data) {
console.log(data.body.und[0].value.toString());
$scope.title = data.title;
$scope.body = data.body.und[0].value.toString();
});
}]);
When I log the body text, it appears as expected - HTML content rather than plain text. However, when I use ionic serve to display the output, the HTML shows up as plain text. This is due to my Drupal based API returning JSON.
Within the about page where I intend for HTML rendering, the template displays the HTML as if it were plain text.
Below is the about.html view:
<ion-view view-title="Information about the App">
<ion-pane>
<div class="card">
<h2>{{title}}</h2>
<div>{{body}}</div>
</div>
</ion-pane>
</ion-view>
I really appreciate any help or advice. Thank you, Bruce