I am trying to have the render name in my jade
I could do:
app.render('email', { render: 'email' }, function(err, html){
// ...
});
but I'd like to know if there is a solution to get it automaticly
Thanks
I have found it helpful to write a wrapper function around render that takes a response object, a view name, and any additional options. I then use this function exclusively instead of res.render. My implementation does things like automatically decorating the title, assigning a unique view id to all views, etc. I use it like:
render(res, 'user.new', {title: 'sign up'});
In this example, the function takes the view name 'user.new' and gives it a unique id: 'user_new_view' assigned to the body element. In your case you could simply pass the value to your template.
The benefit of this pattern is that a single function acts as an interface to all of your views (assuming you use it consistently), so if you need to change the information passed to your views you don't have to edit every endpoint in your application.
Related
I have two controllers. One is login.js and the another one is home.js. I want to redirect to home controller from login controller with a value. To redirect to home controller, i wrote,
response.redirect('/home');
But, i cannot pass value here. When rendering a view with a value,
data = {'value':'hello'};
response.render('view_login',data);
I want to do the same thing. I can pass value while rendering to the view but not when changing controller. Can i do this?
response.redirect('/home',{data: data});
you can use query parameters for this.
When you are redirecting your home page or any other controller then you can write like this
res.redirect(/<some controller>?data=<some data>)
and in that controller where you want to use this value..you can write like this
function login(req,res){
var data = req.query.data;
}
I am trying to get angular formly and angular ui bootstrap typeahead playing nice. What I want is to have my select list populated from an http get request, and each time there is a change to the select field it should fire a function to get a new list of options.
typeahead="address for address in getLocation($viewValue)"
I'm not sure I did the jsbin right, but here we go.
JsBin of my problem
Here is a plunker with the typeahead working alone.
dynamic typeahead works here
I can't even get the getLocation function to fire. I have tried vm.getLocation, but no dice.
Help would be very appreciated!
Thanks. ;-)
Async select options
Watchers Example
Initially the options should be an empty array, and passed in with as shown above. Then you need to add a watcher that updates the $scope.options.templateOptions.options as its called.
But, I am still having trouble getting the typeahead to answer functions. In the typeahead docs you can use a callback to know when it is selected.
typeahead-on-select='onSelect($item, $model, $label)'
My onSelect function in the controller is never called.
Here is a working example...I combined the Async formly example with the UI Bootstrap example...notice it now becomes item.question for item instead of item for item...
Unsure why that is, I checked and its the same format the Async example is coming back as...tried all kinds of ways to get it to display the full JSON object but no luck...
if I set it to item for item, the whole JSON object shows in the model but the search returns [object Object], otherwise its only the single line which I have set to the label, which I guess is the same way it displays normally, so that's OK...
Anyway, it works
http://plnkr.co/IjuJ0HPGCKfZAOrK0u3z?p=preview
app.run(function(formlyConfig) {
formlyConfig.setType({
name: 'typeahead',
template: '<input type="text" ng-model="model[options.templateOptions.label]" uib-typeahead="item.question for item in to.options | filter:$viewValue | limitTo:15" class="form-control">',
wrapper: ['bootstrapLabel', 'bootstrapHasError'],
});
});
I'm writing an Express 4 app, and am currently using twig.js as the view engine since I find it comfortable, though I could be persuaded to change this engine.
I've done a lot of development with PHP/Laravel and have gotten used to what in that camp they call view composers. Using these I can write a composer for a particular view, whether it's a main page view, a layout which other views extend, or a partial other views include. The composer does any necessary logic to prepare whatever data the view needs, and then attaches it to the view's context so it's available during rendering.
For example, I might have a partial which shows the current user status, so if they're logged out it'll maybe have just a log in button, and if they're logged in it'll have their icon, username, and a menu to let them log out etc. The corresponding composer would check to see if a user is logged in, and if so attach the relevant data about the user to the view's context. It then doesn't matter which page includes this partial; the data will always be available without me having to remember to add that specific data to the context passed to the page's main view.
Is there some equivalent in Express? Or does it depend on the template engine I'm using?
Currently, views that are rendered using res.render() need to have their data passed in on every res.render(). If the view uses a partial template that requires certain data points, the view that uses that template will need to have that value passed in through res.render(). So in short, you always need to pass the data in regardless if the data point is required by a partial template that might be shared. When using view engines, nothing is automatically provided to the view.
Are you asking if it's possible to have some view A, that includes partial P_A and be able to pass some data to the partial that's not dependent on routing, i.e wherever you are on the site / app your partial has data bound to it (totally independent of both the route / url and view ) which you could use for your logged in status ?
if so then create your partial, let's use a navigation / menu partial:
please note that this example uses ejs for templating
<nav>
<ul>
<!-- pass the data upon call / include-->
<% for(var i = 0, len=navigation.length;i < len;i++) {%>
<li><%=navigation[i].Text%></li>
<%}%>
</ul>
</nav>
Call / Include your patial on a view
view.ejs
<%- include('nav', { navigation : [{Text : 'Items' ,href : '/' },{Text : 'People' ,href : '/names' }] } )%>
To my knowledge there is nothing like that in expressjs.
I am trying to get my head around ServiceStack self-hosted app and the new API.
Adding two views of the same name in separate folders results in an error at startup. Is this not allowed?
Foo\
Index.cshtml
Bar\
Index.cshtml
Is there a way to specify a template via a decorator on a method or directly as a return value? I know about the convention of naming views after DTOs. I prefer to be more explicit or follow a convention closer to Sinatra/Express.
return Render(typeof(Views.Foo.Index), new { Name = "Nelly" });
The ServiceStack's Razor Rockstars website which holds the documentation for Razor support in ServiceStack lists some options for selecting a different template:
If it doesn't follow the convention (i.e. Request or Response DTO name) then you can dynamically specify which view or layout template gets used by returning a decorated HttpResult like:
return new HttpResult(dto) {
View = {viewName},
Template = {layoutName},
};
If you're using a static view (i.e. service always uses the same view) then you can specify what view to use by decorating it with the [DefaultView] attribute
[DefaultView("Rockstars")]
public object Get(Rockstars request) {
...
return responseDto;
}
In either case, if you want it strong-typed you can use something like typeof(RequestDto).Name.
View names must be unique
Unlike MVC, heirachy's does not influence view selection in ServiceStack and because each View Page (i.e. razor pages in the /Views folder) must be unique, you're free to lay them out in any flat or nested folder structure you wish.
I am writing an app with node.js and coffee-script and coffeekup as template engine. I have a form where I'd like to enable or disable a button depending on whether there are values in some input fields. I am wondering whether there is a straightforward mechanism like in Sproutcore or Ember, where just a binding will do. How should I go about it?
No, there is no such binding out of the box. You have to either implement something like Ember, Knockout or Serenade.js, or roll it yourself. If it's just this one form, I would just have a small script (jQuery below):
function validateForm() {
// Check if form fields are valid, return true if valid, false if not.
}
// Update the disabled attribute on a button inside "formId" anytime an input field is changed.
$("#formId").on("change", "input", function(event) {
$("#formId button").attr("disabled", !validateForm());
});