I am working on an MVC 4 website that makes use of areas, lets call it 'MyMVC'.
As in most MVC projects there is a folder called 'Models' in the root of the website.
Inside this 'Models' directory there is a class called 'MyViewModel.cs' which contains a public class called 'MyViewModel' with a namespace of 'MyMVC.Models'.
Now, in one of the areas, call it 'Area1', there is also the typical MVC structure that also contains a directory called 'Models'. It also contains a class 'MyViewModel.cs' which also contains a class called 'MyViewModel', this time with a namespace of 'MyMVC.Areas.Area1.Models'.
Inside a view I am working on that is inside of the 'Area1\Views' directory I have at the top:
#model MyMVC.Areas.Area1.Models.MyViewModel
#using MyMVC.Areas.Area1.Models
When I go to reference the the MyViewModel like so, for example:
MyViewModel mvm = new MyViewModel();
I get an ambiguous error and it thinks I am referring to the other MyViewModel class although as you can see I have clearly specified with the #model directive and the #using directive which one I am referring to.
Can anyone explain what the ambiguity is?
Can anyone explain what the ambiguity is?
The ambiguity is not in your view. It's in your controller code:
MyViewModel mvm = new MyViewModel();
If in this controller you have both:
using MyMVC.Models;
using MyMVC.Areas.Area1.Models;
it's more than obvious that the C# compiler has no way of knowing which class you are referring to. You could remove the ambiguity by fully specifying the name of the class:
var mvm = new MyMVC.Areas.Area1.Models.MyViewModel();
UPDATE:
You might also have the namespace referenced in the <namespaces> section of your ~/Views/web.config file which is effectively bringing it into scope globally in all your views.
Related
Is it possible to get the whole view model in tag helper Process method (.NET Core MVC)?
Everything passed to the tag helper is done via attributes. If you want the whole view model, then you'd simply so domething like:
<mytag model="#Model" />
And then you'd need a property on your tag helper to bind this to like:
public MyViewModel Model { get; set; }
The name of the attribute corresponds to the name of the property. There's nothing special about "model" here.
However, the utility of that is going to be limited. Tag helpers are intended to be somewhat generic. That's the point: encapsulating reusable logic. If you tie it to a particular view model class (based on the property), then it will only work with that particular view model. The only way to make it more generic would be to use a base class or to literally type it as object, so that anything could be passed. However, with a base class, 1) you need to have every view model inherit from this base class and 2) even then, you'd only be able to use properties on the base class. With object, you wouldn't really be able to reference any properties unless you downcast it to a particular view model class first. While that would allow you to handle any scenario, in principle, you'd be forced to have long blocks of switch or if statements in your tag helper to conditionally handle different scenarios.
Long and short, it's not a great idea for many reasons to pass the whole model. The tag helper should have one specific purpose, and you should only pass things that are specifically needed by it, which also allows you to be explicit about those needs.
If you're looking for something to handle a whole model, you're more likely looking for a partial view or view component, rather than a tag helper.
The viewmodel is actually available if you bind first the for element as :
[HtmlAttributeName("asp-for")]
public ModelExpression For { get; set; }
Then you can access it in your tag helper Process or ProcessAsync through:
For.ModelExplorer.Container.Model
I have searched many places and have not seen anything similar to what I am thinking.
Let's say I want to create a reusable container component, like a card, form, or a modal, and save that as a View Component. How would I add a new view components inside of the "body" of that main View Component in a way that would make it maximally reusable?
The syntax here is just to demonstrate the idea of course, but for example, something like this:
<vc:parent var1="x" var2="y">
<vc:child var3="a" var4="b"></vc:child>
<vc:child var3="c" var4="d"></vc:child>
</vc:parent>
Is anything like this possible?
This doesn't necessarily need to use View Components—maybe partial views?—so long as the primary goal of reusing the containers of other reusable elements is achieved.
I have looked into helpers, but they are no longer available in ASP.NET Core.
So I figured out how to do it.
I used part of this tutorial about helpers: Templates With Razor
And modified it so it works with ViewComponents.
So to get it working, in a minimal example, create a ViewComponent class as such:
[ViewComponent(Name = "Test")]
public class VCTest : ViewComponent
{
public IViewComponentResult Invoke(Func<dynamic, object> Content)
{
return View(Content);
}
}
Create the actual template that you want, in a cshtml file like this:
#model Func<dynamic, object>
<div id="SomeTemplateTest">
#Model(null)
</div>
In this very simple case I just used the Func as model since there is only one parameter, but for more parameters you'd just have to call #Model.funname(null) instead of just #Model(null). No big deal.
when calling this component from your view, create your child elements beforehand like so:
#{Func<dynamic, object> children=
#<div>
<vc:child var1="a" var2="b"></vc:child>
<vc:child var1="c" var2="d"></vc:child>
<vc:child var1="e" var2="f"></vc:child>
</div>;}
The div is there only to encapsulate all the elements. I haven't found a way around that but it has no major implications.
Then call the parent ViewComponent tag passing on the parameters accordingly:
<vc:test content="children"></vc:form-test>
And that's it, worked perfectly. It is unfortunate that I could not find a more seamless way. But this does the job.
If anyone knows of a better alternative I'd love to know more.
Given an example based on old MVC5:
Views/Shared/Index.cshtml - a view for a SPA app. It contains some markup and a reference to a layout-page:
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
In _Layout.cshtml there're number of includes which are being used via RenderPage helper:
#RenderPage("~/Views/Shared/_ImportCssInline.cshtml")
#RenderPage("~/Views/Shared/_ImportCssLinks.cshtml")
Now in AspNet5 #RenderPage helper isn't available.
It was the method of WebViewPage/WebPageBase/WebPageRenderingBase. Now they were replaced by RazorPage. But there's no RenderPage method in it.
What should be used instead?
p.s. issue
I've always had success using #Html.Partial("~/Views/Shared/_ImportCssInline.cshtml") rather than #RenderPage - I hope there's not usage differences for you. There are also async versions of these imports now, too.
Since the Html property is now injectable as the interface IHtmlHelper, I assume the direct methods were removed in the improvements for the testability of the views.
I'm using the MVVM pattern with MVVM Light. I have a ViewModelLocator defined in App.xaml which holds all the ViewModels which are bound to from the Views using Blend.
I have an AppViewModel which basically contains all the important global info for my app, like user preferences. AppViewModel is instantiated by ViewModelLocator, which is in turn, instantiated by app.xaml.
The trouble is, I need to access AppViewModel from inside OnLaunched, however, at this stage of the application lifecycle, it appears app.xaml has not yet instantiated its declared resources. It appears to only do this after a Frame.Navigate().
I need to access AppViewModel because I have to inspect the properties on there in order to work out which Page to load. Hence it's a chicken-and-egg situation.
If I separately instantiate AppViewModel inside OnLaunched, then I can access AppViewModel, but then ViewModelLocator gets instantiated twice which causes problems with my IoC.
Is there a way of manually instantiating items declared inside app.xaml? Or is there a way to get app.xaml to load its resources before presenting a UI?
Or am I doing this wrong? Generally speaking, I regard the application to be the view model layer and the views essentially observe that... so hence I need the ViewModels available before I present any UI.
XAML:
<Application.Resources>
<vm:ViewModelLocator x:Key="Locator" d:IsDataSource="True" />
</Application.Resources>
Code:
protected override void OnLaunched(LaunchActivatedEventArgs e)
{
var vml = App.Current.Resources["Locator"] as ViewModelLocator; // exception raised
Exception:
WinRT information: Cannot find a resource with the given key.
thanks
How about you instantiate the ViewModelLocator when you first need it and then add it to Application.Resources once Application.Resources is otherwise initialized or whenever you need? You don't need to add key value pairs to the ResourceDictionaries in XAML always.
Is it correct to store all my ViewModels in SimpleIoc? For instance I am having three pages MainPage, Photos, Directories (therefore three ViewModels -> MainVM, PhotosVM, DirectoriesVM). Should I set DataContext in each page to View Model Property in ViewModelLocator or nest ViewModels as properties in MainVM and bind each page DataContext to Main.PhotosVMProperty, Main.DirectoriesVMProperty and so on? Could anyone explain me idea and purpose of IoC ?
First, lets look at what ViewModelLocator does and why we use it:
ViewModelLocator is declared as an object on our App.xaml page and is an application singleton. We're going to have one, and only one of them available to the application when it runs.
ViewModelLocator is the source for all our ViewModels in MVVM Light. For each ViewModel we'll have a property on the ViewModelLocator that allows us to get a ViewModel for a View. This code looks like this:
public class ViewModelLocator
{
public MainPageViewModel MainPage
{
get { return new MainPageViewModel(); }
}
}
This is a piece of my App.xaml:
<Application.Resources>
<vm:ViewModelLocator
x:Key="ViewModelLocator" />
</Application.Resources>
This is a piece from View.xaml
DataContext="{Binding MainPage, Source={StaticResource ViewModelLocator}}"
So far so good. To answer your first question, do you have to use Ioc in MVVM Light? No. There's no need as your viewmodel will be given to your view fully built and instantiated by the ViewModelLocator.
Now, onto your second question: What's the purpose of IoC?
IoC is designed to allow you to do the following:
With Mvvm Light you do the above like this:
public class ViewModelLocator
{
public ViewModelLocator()
{
ServiceLocator.SetLocatorProvider(() => SimpleIoc.Default);
if (ViewModelBase.IsInDesignModeStatic)
{
SimpleIoc.Default.Register<IDataService, Design.DesignDataService>();
}
else
{
SimpleIoc.Default.Register<IDataService, DataService>();
}
SimpleIoc.Default.Register<MainViewModel>();
}
public MainViewModel Main
{
get { return SimpleIoc.Default.GetInstance<MainViewModel>(); }
}
}
public class MainViewModel
{
public ObservableCollection<Foo> Foos { get; set; }
public MainViewModel(IDataService dataService)
{
_dataService=dataService;
Foos=_dataService.GetFoos();
}
}
When I resolve my MainViewModel when I call
SimpleIoc.Default.GetInstance<MainViewModel>()
what happens internally is that the SimpleIoc checks to see if the MainViewModel has any dependencies (parameters in its constructor). It then tries to resolve these parameters by looking at the interfaces that have been registered with it. It does this recursively, so if DataService had a dependency it would be instantiated and passed to the DataService constructor when it was being instantiated as well.
Why would I do all this work?
Make your classes easily unit testable
Make your code interface-driven. This means that you're referencing interfaces rather than concrete classes
Make your code loosely coupled. This means that someone can change the implementation of an interface and classes that consume that interface don't care and don't have to be re-coded.
Resolve your classes dependencies in an automated way.
In MVVM Light, you'll see that it can tell when it's running in design-mode (ViewModelBase.IsInDesignModeStatic), this means that you can create design-time services to provide your viewmodels data so your View in Visual Studio contains actual data.
MVVM Light has a lot of nice features but it appears to me that the Service Locator creates unwanted dependency of the views on the view models. Ideally, I would like to have the ViewModelLocator in Library A, the view models in Library B and the views in Library C. Then I can mix and match these as needed for future projects. However, in the design of MVVM Light, as far as I can see, the views (Library C) will always have a dependency on the ViewModelLocator (this is okay) but because the ViewModelLocator (Library A) will always have a dependency on the view models (Library B), then the views will always depend on the view models (this is not okay because a view now must include all the view model libraries it was ever used with across all products).
I believe that Prism gets around this problem by using string keys somehow. Am I missing something?
Oops! I think I just answered my own question. The solution is to make Library A, the ServiceLocator, specific to a particular solution (product). It then contains a reference to the view models only for that solution. Then the views depend on this ServiceLocator which in turn depends on all the view models for that product. The final result is that the views depend only on the views models that it will be used with for that product. There is no problem with thee fact that we are duplicating the ServiceLocator for each solution because this module contains only code that is specific to the solution. The components of the ServiceLocator such as the SimpleIoc class are, of course, common to all solutions, but these have been factored out into reusable classes that we invoke in ServiceLocator.
To summarize things, the problem I am trying to solve is suppose that a solution has 6 view models, four of which are closely related and two of which are closely related. We therefore create two assemblies, each containing the closely related view models. Suppose we design a product that uses one set of view models and the solution is designed to run Windows 8. Now the views are all different and we want to re-use only one set (assembly) of view models. So we just create a new ServiceLocator assembly that points to this assembly of view models and also any others that we need. Our new Windows 8 views now depend on this new ServiceLocator assembly and only the view models that are used in our new product (solution).