With Pinegrow Web Designer you can test and edit AngularJS apps at the same time.
Since version 1.23, Pinegrow has AngularJS framework plugin that adds ng* properties to elements in GUI. That’s the beginning of AngularJS support in Pinegrow and we’ll be expanding on that in the future. Your feedback is welcome!
Pinegrow comes with a starting page for a simple AngularJS todo app:
Pinegrow checks if HTML page uses angular.js and automatically activates Pinegrow AngularJS support. You can also do that manually through Page -> Manage frameworks:
You can test and edit the app at the same time. Use “Test clicks” to use the app, or even more convenient, SHIFT + Click to let Pinegrow pass clicks to the app even when “Test clicks” is not selected:
AngularJS Pinegrow plugin adds Angular properties and events to elements:
Or, you can copy the code to the main HTML page and use Page -> Edit code to edit it in Pinegrow. Again, press CMD + R to apply changes made to the code:
Use Page -> Preview in Browser to open the page in your default external browser. No need to save the changes first. Or click on the link icon next to “Preview in browser” to copy the preview link to clipboard:
That’s it. Have fun with Pinegrow and AngularJS!
Last updated on October 26, 2015 at 4:32 pm