Angularjs bind not working

Vincent Bastos

I am running onsenui 2.0.4 with angularjs 1. For some reason in my ios device, the model variables are not being rendered properly. They are appearing as {{model.variable}}, however when I run the app in a browser the variables appear correctly. Any ideas anyone?

Fran Diox

@Vincent-Bastos I don’t think anybody can determine the issue without showing some code or console errors :/

arcadio

I have the same problem… you can see “Urgent: <ons-list> doesn’t work in iOS”. I don’t know a solution in this moment.

I have changed <ons-list>, <ons–list-item>… for <ons-row> its not good but it work

Fran Diox

@arcadio @Vincent-Bastos Recently I saw this problem in a user’s code. His problem was using ons-template inside a separate file, not in index.html. In that separate file he had a route component (ons-splitter) and right below it an ons-template containing the page of the splitter. Instead of doing this, the correct behavior would be to put the page directly inside the splitter (without ons-template) or create a new file for this page (again, without ons-template). For some reason looks like it worked on Android but it shouldn’t.

That’s all what I can say about it without seeing any code :/

arcadio

My code is:

<html lang="en" ng-app="app" ng-csp>
	<head>
	...
	...
	</head>
	<body ng-app="myApp">    
		<div ng-controller="PruebaController">
		  <ons-sliding-menu
			menu-page="menu.html" main-page="hola.html" side="left"
			var="menu" type="reveal" max-slide-distance="260px" >
		  </ons-sliding-menu>
			<ons-template id="menu.html">
				<ons-page modifier="menu-page">
				....
				....
				</ons-page>
			</ons-template>
			<ons-template id="showImagen.html">  
				<ons-page>
				....
				....
					</ons-page>
			</ons-template>
		</div> 
	</body>
</html>

in menu I see {{…}} and it doesn’t show the text into <ons-list-item> I wrote in the message: Urgent: <ons-list> doesn’t work in iOS

Can you find out my error?

Thanks in advance

Fran Diox

@arcadio I see two ng-app attributes there (in html and body). How are you bootstrapping Onsen UI? ons.bootstrap()? (equivalent of angular.module('my-app', ['onsen']);)

arcadio

I transcribed it wrong
Still not working

vbastos

Sorry about leaving this for so long, but I made the mistake of removing the following lines of code to bootstrap my app, it worked after I used the method below again.

          var bootstrapCallback = function() {
              // retrieve the DOM element that had the ng-app attribute
              var bodyElm = document.getElementById('ngApp');
              angular.bootstrap(bodyElm, ["trytonSSApp"]);
          }
          if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry|IEMobile)/)) {
              document.addEventListener("deviceready", bootstrapCallback, false);
          }
          else {
              bootstrapCallback();
          }