<div>
    Number Of Clicks <span data-bind="text: numberOfClicks"></span> times
    <button data-bind="click: clickMe">Click me</button>
</div>
 
<script type="text/javascript">
    var viewModel = {
        numberOfClicks : ko.observable(0),
        clickMe: function() {
            var previousCount = this.numberOfClicks();
            this.numberOfClicks(previousCount + 1);
        }
    };
</script>

<ul data-bind="foreach: places">
    <li>
        <span data-bind="text: $data"></span>
        <button data-bind="click: $parent.removePlace">Remove</button>
    </li>
</ul>
 
 <script type="text/javascript">
     function MyViewModel() {
         var self = this;
         self.places = ko.observableArray(['Tehran', 'Esfahan', 'Shiraz']);
 
         self.removePlace = function(place) {
             self.places.remove(place)
         }
     }
     ko.applyBindings(new MyViewModel());
</script>

var personViewModel = {
  firstName: ko.observable("Masoud"),
  lastName: ko.observable("Pakdel")
  this.fullName = ko.computed(function() {
         return this.firstName() + " " + this.lastName();
}, this);
};

<span data-bind='text: fullName'></span>

function Product(name, price) {
   this.name = ko.observable(name);
   this.price = ko.observable(price);
}

this.shoppingCart = ko.observableArray([
  new Product("Beer", 10.99),
  new Product("Brats", 7.99),
  new Product("Buns", 1.49)
]);

<table>
 <thead><tr>
 <th>Product</th>
 <th>Price</th>
 </tr></thead>
    <tbody data-bind='foreach: shoppingCart'>
  <tr>
   <td data-bind='text: name'></td>
   <td data-bind='text: price'></td>
 </tr>
</tbody>
</table>

<button data-bind='click: addProduct'>Add Beer</button>

this.addProduct = function() {
   this.shoppingCart.push(new Product("More Beer", 10.99));
};

function PersonViewModel()
        {
            this.firstName = ko.observable("John");
            this.lastName = ko.observable("Smith");
            this.checkout = function () {
                alert("Trying to checkout");
            };
            this.fullName = ko.computed(function(){
                return this.firstName() + " " + this.lastName();
            }, this);

            this.shoppingCart = ko.observableArray([
                new Product("Beer", 10.99),
                new Product("Brats", 7.99),
                new Product("Buns", 1.49)
            ]);

            this.addProduct = function () {
                this.shoppingCart.push(new Product("More beer", 10.99));
             };
        };

this.removeProduct = function(product) {
   self.shoppingCart.remove(product);
}; 

function PersonViewModel() {
  var self = this;

<tr>
   <td data-bind='text: name'></td>
   <td data-bind='text: price'></td>
   <td><button data-bind='click:
   $root.removeProduct'>Remove</button></td>
</tr>

Building an Online Ticket Store with Blazor WebAssembly
Webinar agenda:

0:00 Welcome
2:47 Introduction
4:00 New Blazor WebAssembly Application
5:00 Adding dotnet watch and Hot Reload
7:20 Components and routing
15:29 Making API calls
28:13 CSS Isolation
38:38 Testing components
48:40 State management
1:07:50 State management with cascading parameters
1:18:48 Questions and Wrap-Up 

 <!--<script src="Scripts/Libs/localstorage_adapter.js" type="text/javascript"></script>-->

 <!--<script src="Scripts/App/store.js" type="text/javascript"></script>-->

Blogger.PostsRoute = Ember.Route.extend({
    model: function () {
        return this.store.find('post');
    }
});

 DS.RESTAdapter.reopen({
      namespace: 'api'
});

 <script src="Scripts/Adapters/web_api_adapter.js" type="text/javascript"></script>

namespace EmberJS03.Models
{
    public class Post
    {
        public int Id { set; get; }
        public string Title { set; get; }
        public string Body { set; get; }
    }
}

using System;
using System.Web.Http;
using System.Web.Routing;
using Newtonsoft.Json.Serialization;
 
namespace EmberJS03
{
    public class Global : System.Web.HttpApplication
    {
 
        protected void Application_Start(object sender, EventArgs e)
        {
            RouteTable.Routes.MapHttpRoute(
               name: "DefaultApi",
               routeTemplate: "api/{controller}/{id}",
               defaults: new { id = RouteParameter.Optional }
               );
 
            var settings = GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings;
            settings.ContractResolver = new CamelCasePropertyNamesContractResolver();
        }
    }
}

namespace EmberJS03.Controllers
{
    public class PostsController : ApiController
    {
        public IEnumerable<Post> Get()
        {
            return DataSource.PostsList;
        } 
    }
}

  WARNING: Encountered "0" in payload, but no model was found for model name "0" (resolved model name using DS.RESTSerializer.typeForRoot("0"))

[
  {
    Id: 1,
    Title: 'First Post'
  }, {
    Id: 2,
    Title: 'Second Post'
  }
]

{
  posts: [{
    id: 1,
    title: 'First Post'
  }, {
    id: 2,
    title: 'Second Post'
  }]
}

using System.Web.Http;
using EmberJS03.Models;
 
namespace EmberJS03.Controllers
{
    public class PostsController : ApiController
    {
        public object Get()
        {
            return new { posts = DataSource.PostsList };
        }
    }
}

 public HttpResponseMessage Post(Comment comment)

{"comment":{"text":"data...","post":"3"}}
 

namespace EmberJS03.Controllers
{
    public class CommentsController : ApiController
    {
        public HttpResponseMessage Post(HttpRequestMessage requestMessage)
        {
            var jsonContent = requestMessage.Content.ReadAsStringAsync().Result;
            // {"comment":{"text":"data...","post":"3"}}
            var jObj = JObject.Parse(jsonContent);
            var comment = jObj.SelectToken("comment", false).ToObject<Comment>();


            var id = 1;
            var lastItem = DataSource.CommentsList.LastOrDefault();
            if (lastItem != null)
            {
                id = lastItem.Id + 1;
            }
            comment.Id = id;
            DataSource.CommentsList.Add(comment);

            // ارسال آی دی با فرمت خاص مهم است
            return Request.CreateResponse(HttpStatusCode.Created, new { comment = comment });
        }
    }
}

Blogger.Post = DS.Model.extend({
   title: DS.attr(),
   body: DS.attr(),
   comments: DS.hasMany('comment', { async: true } /* lazy loading */)
});

namespace EmberJS03.Models
{
    public class Post
    {
        public int Id { set; get; }
        public string Title { set; get; }
        public string Body { set; get; }
 
        // lazy loading via an array of IDs
        public int[] Comments { set; get; } 
    }
}

namespace EmberJS03.Models
{
    public class Post
    {
        public int Id { set; get; }
        public string Title { set; get; }
        public string Body { set; get; }
 
        // load related models via URLs instead of an array of IDs
        // ref. https://github.com/emberjs/data/pull/1371
        public object Links { set; get; }
 
        public Post()
        {
            Links = new { comments = "comments" }; // api/posts/id/comments
        }
    }
}

namespace EmberJS03
{
    public class Global : System.Web.HttpApplication
    {
 
        protected void Application_Start(object sender, EventArgs e)
        {
            RouteTable.Routes.MapHttpRoute(
               name: "DefaultApi",
               routeTemplate: "api/{controller}/{id}/{name}",
               defaults: new { id = RouteParameter.Optional, name = RouteParameter.Optional }
               );
 
            var settings = GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings;
            settings.ContractResolver = new CamelCasePropertyNamesContractResolver();
        }
    }
}

namespace EmberJS03.Controllers
{
    public class PostsController : ApiController
    {
        //GET api/posts/id
        public object Get(int id)
        {
            return
                new
                {
                    posts = DataSource.PostsList.FirstOrDefault(post => post.Id == id),
                    comments = DataSource.CommentsList.Where(comment => comment.Post == id).ToList()
                };
        }
    }
}

namespace EmberJS03.Controllers
{
    public class PostsController : ApiController
    {
        public HttpResponseMessage Delete(int id)
        {
            var item = DataSource.PostsList.FirstOrDefault(x => x.Id == id);
            if (item == null)
                return Request.CreateResponse(HttpStatusCode.NotFound);

            DataSource.PostsList.Remove(item);

            //حذف کامنت‌های مرتبط
            var relatedComments = DataSource.CommentsList.Where(comment => comment.Post == id).ToList();
            relatedComments.ForEach(comment => DataSource.CommentsList.Remove(comment));

            return Request.CreateResponse(HttpStatusCode.OK, new { post = item });
        }
    }
}

 Attempted to handle event `pushedData` on  while in state root.deleted.inFlight.

Blogger.PostController = Ember.ObjectController.extend({
    isEditing: false,
    actions: {
        edit: function () {
            this.set('isEditing', true);
        },
        save: function () {
            var post = this.get('model');
            post.save();
 
            this.set('isEditing', false);
        },
        delete: function () {
            if (confirm('Do you want to delete this post?')) {
                var thisController = this;
                var post = this.get('model');
                post.destroyRecord().then(function () {
                    thisController.transitionToRoute('posts');
                });
            }
        }
    }
});

 public static string RemoveAllHtmlTags(this string text)
        {
            var withoutHtml = String.IsNullOrEmpty(text) ?
                          String.Empty :
                          Regex.Replace(text, @"<(.|\n)*?>", String.Empty);



            withoutHtml = withoutHtml.Replace("&nbsp;", " ");
            withoutHtml = withoutHtml.Replace("&zwnj;", " ");
            withoutHtml = withoutHtml.Replace("&quot;", " ");
            withoutHtml = withoutHtml.Replace("amp;", "");
            withoutHtml = withoutHtml.Replace("&laquo;", "«");
            withoutHtml = withoutHtml.Replace("&raquo;", "»");

            return withoutHtml;
        }