Underscore templage passted variable access in template script code - backbone.js

I have a Marionette view in which I am rendering the view like :
var template = _.template(RequestorFormTemplate);
$(this.el).html(template({fdata:fdata}));
In the template (html) I have a java script where I need to access fdata. How do I access the variable in script. I know we can access this in HTML like <%=%> but can I access this in script.

Related

Vtiger CRM: How I can load modified .tpl file?

I want to load a modified .tpl file vtigercrm\layouts\vlayout\modules\Vtiger\ListViewContents.tpl to a .php file from which I get HTML data after using AJAX and javascript . It's something feasible?
Im assuming that you want to view that template in the DetailView. In that case you can make a widget in module/Vtiger/models/DetailView.php in getWidget(). Just copy paste and change. The link you give here should go to a function in /module/Vtiger/views/Detail.php.
you should add your new function in the constructor.
$this->exposeMethod('Yourfunctionname');
Here you can copy any function and change it. you need to feed your variables to smarty with :
$viewer->assign('SMARTYVARNAME', $phpVar);
to fill the template. And finally you need to referance the template.
echo $viewer->view('tplname.tpl', $moduleName, 'true');
im not able to comment yet so i hope this is enough.

Loading partial html template into Angular app using Laravel

I'm trying to use the RouteProvider functionality in Angular. A different partial html template should be loaded depending on whether the user is editing a form, viewing a list of completed entries, etc. I've been unable to load the html templates within the same page. Instead, the user is redirected to a different page.
Here's the relevant Angular code:
.when(/new', {
controller: 'CreateCtrl'
templateUrl: 'partials/newform.html'
The Laravel Route:
Route::resource('services', 'ServicesController');
The newform.html file is located at resources/views/partials/newform.html within Laravel.
Any thoughts on how I can load these partial html templates from Laravel?
One way would be to reference the full path to the partials
.when('/new', {
controller: 'CreateCtrl'
//depending on your path adjust it
templateUrl: 'partials/newform'
since you are just using .html not tempalte.blade.php file for template you should move it to public folder.
Update:
If you really dont want to move the template out of view folder of laravel
create a route and serve your html from there
Route::group(array('prefix' => 'partials'), function(){
Route::get('/newform', function()
{
return File::get(app_path().'Views/partials/angular.html');
});
});
Note: I will suggest you not to mix Laravelc template with Angular, keep Laravel as REST API, and your Angular should separate layer.
Here are some Pros and Cons for both approach
I found another way using gulp, i leave my solution :)
In gulpfile.js inside elixir function add this line:
var elixir = require('laravel-elixir');
elixir(function(mix) {
mix.copy('resources/assets/js/angular/components/**/*.template.html', public/angular-templates');
//Find all files with suffix .template.html
});
As you notice it, i created a folder called 'angular' and then another one called 'components', there we will have our components
Angular-----------------------------
--Components------------------------
----my-component.directive.js-------
----my-component.template.html------
We have to create a global angular variable taking our browser window origin (www.myapp.com, localhost:8000, etc) by doing:
angular.module('myModule',[])
.value('pathAssets', location.origin + '/angular-templates/')
In our templateUrl we will call the template by writting:
templateUrl: pathAssets + '../angular-templates/my-template.html',
I have to say we have to concat our angular files in a file, otherwise it won't work D: if you don't know how to do it, add these lines in your gulpfile.js
mix.scripts([
'../../../bower_components/angular/angular.min.js',
'angular/app.js',
'angular/controllers/**/*.controller.js',
'angular/components/**/*.directive.js',
'angular/bootstrap.js',
], 'public/js/app.js'); //We concatenate angular files saving them in app.js
Finally execute the command 'gulp' in terminal(In our project), it should generate a new folder in public called angular-templates.
CONCLUSION
1. Move all your angular templates to public inside a specific folder by using elixir.
2. create a global variable in angular to save your origin URL and use it in your directives it automatically with this template in public.

not able to dynamically update the view when data is changing

I have a set of files in a server which I am looping though and constructing a JSOn and saving it as a separate file. I am using python for this. Works quite well. Now the scope is the number of files in the directory will increase/ change throughout the day..and I am running the script every 10 min to rewrite the json...the file name stays same and i am calling it in a single page html document using angular.js..Again fairly simple...But now I am having problem when the JSON is changing I am not seeing any change on the page unless I reload the page. Could I do something about this?
With angular I am using
$http('something.json').success(callback function with some argument data)
and in the markup something like
<ul>
<li ng-repeat="x in data">{{x.id}}</li>
</ul>
Your call to $http is one-time operation which happens after page load like this:
$http('something.json').success(function(data){
$scope.data = data;
});
angular is kickstarted
ng-controller containing $http request is evaluated and request for 'something.json' is sent
...
when your json arrives, your success function is called with data from json
view (html template) is updated with new data
Angular keeps your model (eg $scope.data) and UI (expressions in template) up to date, but it doesn't update external resources.
If you want to periodically poll for changes in 'something.json'
you can use $timeout service as suggested in JaKXz's comment.

Spring MVC with AngularJS get data

I have an object I can access in the .jsp file using the syntax ${items} which is actually just a JSTL JSON object from a GET mapped to a page called items. Is there a way to get and parse this data using AngularJS and have it ng-repeat?
You could render the object as a JavaScript variable assignment in a script block on the page. Then access it via said variable in JavaScript. Assuming ${items} renders as JSON:
<script>
var myGlobalData = ${items};
</script>

Angular.js: How can I return a content without view? Returning atom feed to users

I plan to generate an Atom feed inside my AngularJS controller. A want to generate a view, but not on the server-side, because I want to replace the URI with a new AngularJS route.
Now I know how to write XML with JavaScript, but I have no idea about how to returning a XML content without a view.
My route setting is quite normal like below. It uses templateUrl to render a partial view.
.when('/posts', {
templateUrl: 'theme/post_list.html',
controller: PostsController
})
Is it possible to serve XML content without a view using AngularJS? Like so:
.when('/posts.atom', {
controller: PostsController
})
Generating the angular.js routed Atom feed on the server-side is possible, but I don't want it.
Use the following process:
Append an <object> or <iframe> to the DOM with the XML within the tag
OR:
Return Atom from the service
Store in a documentFragment
Use transformToFragment or DOMParser to create a view
Use XMLSerializer to convert the view to a string
Insert an XML stylesheet into the string:
<?xml-stylesheet href="feed.css"?>
Use the string as the value of the srcdoc attribute:
<iframe srcdoc="{{atomfeed}}" height="95%" width="100%">
For example:
$scope.atomstyle='<?xml-stylesheet href="feed.css"?>'
$scope.atomboilerplate='<feed xmlns="http://www.w3.org/2005/Atom">'
$scope.atomhead='<title></title><link></link>'
$scope.atomcontent='<entry><title></title><link></link></entry>';
$scope.atomtail='</feed>'
$scope.atomfeed=String().concat
(
$scope.atomstyle,
$scope.atomboilerplate,
$scope.atomhead,
$scope.atomcontent,
$scope.atomtail
)
References
insert an iframe into page dynamically in AngularJS
XML 1.0, Section 2.8: Prolog and Document Type Declaration
Embedded Content - HTML5: srcdoc
How to show RSS in an iframe or div?
Mozilla source: feeds/subscribe.css
AngularJs (all versions) breaks on IE11 in document mode ie=8
view-source: URI scheme
Feed View overrides XSLT stylesheet defined in XML document

Resources