3. Angularjs bind not working

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Angularjs bind not working

  • V

    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?

    0 1 Reply
  • Onsen UI

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

    0
  • A

    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

    0
  • Onsen UI

    @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 :/

    0
  • A

    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

    0 1 Reply
  • Onsen UI

    @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']);)

    0
  • A

    I transcribed it wrong
    Still not working

    0
  • V

    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();
          }
    0