.net core MVC中級教程(一)

1、創建.net core2.2 mvc項目
2、創建數據模板、服務、控制器
3、創建視圖html

這次教程廢話少說,看不懂能夠看我初級教程git

1、創建.net core2.2 mvc項目

創建TutorialStudy.Web空項目
在這裏插入圖片描述github

在這裏插入圖片描述

2、創建數據模板、服務、控制器

創建4、五個文件夾
在這裏插入圖片描述
在Model文件夾下創建Student類與Gender枚舉web

using System;
namespace TutorialStudy.Model
{
    public class Student
    {
        public int Id { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public DateTime BirthDate { get; set; }
        public Gender Gender { get; set; }
    }
}
namespace TutorialStudy.Model
{
    public enum Gender
    {
        女士=0,
        男士=1,
        其餘=2
    }
}

在Services文件內添加接口IRepository與實現類InMemoryRepositoryc#

using System.Collections.Generic;

namespace TutorialStudy.Services
{
    public interface IRepository<T> where T:class
    {
        IEnumerable<T> GetAll();
        T GetById(int studentId);
        T Add(int i);
    }
}
using System;
using System.Collections.Generic;
using System.Linq;
using TutorialStudy.Model;

namespace TutorialStudy.Services
{
    public class InMemoryRepository:IRepository<Student>
    {
        private readonly List<Student> _student;

        public InMemoryRepository()
        {
           _student=new List<Student>
           {
               new Student
               {
                   Id=1,
                   FirstName = "龍",
                   LastName = "族",
                   BirthDate = new DateTime(1998,10,14),
                   Gender = Gender.男士
               },
               new Student
               {
                   Id=2,
                   FirstName = "醉",
                   LastName = "人",
                   BirthDate = new DateTime(1998,10,14),
                   Gender = Gender.男士
               },
               new Student
               {
                   Id=3,
                   FirstName = "東方",
                   LastName = "不敗",
                   BirthDate = new DateTime(2008,2,14),
                   Gender = Gender.女士
               }
           };

        }

        public IEnumerable<Student> GetAll()
        {
            return _student;
        }

        public Student GetById(int studentId)
        {
            return _student.FirstOrDefault(x => x.Id == studentId);
        }

        public Student Add(int i)
        {
            throw new NotImplementedException();
        }
    }
}

在Statup類中進行註冊服務瀏覽器

using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.DependencyInjection;
using TutorialStudy.Model;
using TutorialStudy.Services;

namespace TutorialStudy
{
    public class Startup
    {
        // This method gets called by the runtime. Use this method to add services to the container.
        // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddScoped<IRepository<Student>, InMemoryRepository>();
            services.AddMvc();
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            app.UseStaticFiles();
            app.UseStatusCodePages();
            app.UseMvc(routes => { routes.MapRoute("Default", "{controller=Home}/{action=Index}/{id?}"); });


            app.Run(async (context) =>
            {
                await context.Response.WriteAsync("Hello World!");
            });
        }
    }
}

接下來是視圖模板,爲視圖提供數據的模板,
在這裏插入圖片描述
創建StudentViewModel類mvc

using TutorialStudy.Model;

namespace TutorialStudy.ViewModel
{
    public class StudentViewModel
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int Age { get; set; }
        public Gender Gender { get; set; }
    }
}
using System.Collections.Generic;

namespace TutorialStudy.ViewModel
{
    public class HomeIndexViewModel
    {
        public IEnumerable<StudentViewModel> Students { get; set; }
    }
}

接下來是控制器,在Controllers文件夾內創建HomeController類app

using Microsoft.AspNetCore.Mvc;
using System;
using System.Linq;
using TutorialStudy.Model;
using TutorialStudy.Services;
using TutorialStudy.ViewModel;

namespace TutorialStudy.Controllers
{
    public class HomeController:Controller
    {
        private readonly IRepository<Student> _repository;

        public HomeController(IRepository<Student> repository)
        {
            _repository = repository;
        }

        [HttpGet]
        public IActionResult Index()
        {
            var list = _repository.GetAll();

            var vms = list.Select(x => new StudentViewModel
            {
                Id = x.Id,
                Name = $"{x.FirstName}{x.LastName}",
                Age = DateTime.Now.Subtract(x.BirthDate).Days / 365,
                Gender = x.Gender
            });

            var vm=new HomeIndexViewModel
            {
                Students = vms
            };
            return View(vm);
        }
    }
}

3、創建視圖

對了,把視圖數據模板放入視圖裏面去
在這裏插入圖片描述
在裏面創建Home文件夾,創建
在這裏插入圖片描述
@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers
大小寫不要錯,這句話是爲了能在cshtml裏面寫c#語句而寫的
再創建視圖
在這裏插入圖片描述async

@model TutorialStudy.Views.ViewModel.HomeIndexViewModel

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width"/>
    <title>學生信息主頁</title>
</head>
<body>
<h1>Student</h1>
<ul>
    @foreach (var s in Model.Students)
    {
        <li>
            @s.Name (@s.Age)
        </li>
    }
</ul>
</body>
</html>

而後運行
在這裏插入圖片描述
額,,,上面的草帽小子骷髏頭是谷歌瀏覽器的主題,這是就能夠看見其信息了,
第一步暫時完成
本教程將會持續更新哦,不懂得能夠留言,最好先看看個人mvc初級教程再來看這個
github地址:https://github.com/1045683477/.net-core-mvc-intermediatesvg

相關文章
相關標籤/搜索