完整代码:https://github.com/scotch-io/laravel-angular-comment-app
目前,Laravel和Angular均已经成为了Web发展世界里非常著名的工具。Laravel以给PHP社区引入的伟大内容著称,Angular以其惊人的前端工具及简单著称。组合这两大框架似乎是合乎逻辑的下一步。
在我们的使用环境下,我们将使用Laravel作为后端的RESTful API,Angular作为前端,以创建一个简单的单页的评论应用。
下面是一个简单的例子,展示了如何开始使用这两种技术,所以不用害怕什么额外的数据库性的东西、如何处理子评论什么的。
我们将创建什么
这将是一个简单的单页评论应用程序:
RESTful Laravel API处理获取、创建和删除评论;
Angular前端负责显示我们创建的表单和评论;
能够新建评论并把它添加到我们的W/O页面刷新列表;
能够删除评论并把它从W/O页面刷新列表移除。
总体上,这些都是非常简单的概念。我们重点是关注Laravel与Angular如何一起协作的错综复杂关系。
Laravel后端
设置Laravel
继续设置好你的Laravel,我们将做一些基础工作使我们的后端实现评论的增删改查:
创建一个数据库迁移
将样本评论植入数据库
为我们的API创建路由表
创建一个“全部获取”路由表让Angular出来路由
为评论创建一个资源控制器
准备数据库迁移
我们要一个简单的、存储评论的结构体,只需要包括内容和作者。让我们创建Laravel迁移来创建评论。
我们来运行artisan命令创建评论迁移,这样就可以在我们的数据库里建立评论表:
php artisan migrate:make create_comments_table --create=comments
我们将使用Laravel模式构建器创建所需的“内容”和“作者”域。Laravel也会创建id和timestamps列,这样我们可以知道这条评论是什么时候添加的。以下是评论表的代码:
// app/database/migrations/####_##_##_######_create_comments_table.php ... /** * Run the migrations. * * @return void */ public function up() { Schema::create('comments', function(Blueprint $table) { $table->increments('id'); $table->string('text'); $table->string('author'); $table->timestamps(); }); } ...
确定你在“app/config/database.php”文件中用正确的凭证调整了数据库设置。现在我们运行迁移,这样就能用所需的列创建这张表:
php artisan migrate
评论模型
我们将用Laravel Eloquent模型与数据库进行交互。这很容易做到,让我们来创建一个模型:“app/models/Comment.php”:
<?php // app/models/Comment.php class Comment extends Eloquent { // let eloquent know that these attributes will be available for mass assignment protected $fillable = array('author', 'text'); }
现在有了表和模型,让我们通过Laravel Seeding向表中添加一个样本数据。
播种数据库
我们需要一些评论来测试几件事。让我们创建一个种子文件并插入三个样本评论到数据库。
创建一个文件:“app/database/seeds/CommentTableSeeder.php”,并添加以下代码:
<?php // app/database/seeds/CommentTableSeeder.php class CommentTableSeeder extends Seeder { public function run() { DB::table('comments')->delete(); Comment::create(array( 'author' => 'Chris Sevilleja', 'text' => 'Look I am a test comment.' )); Comment::create(array( 'author' => 'Nick Cerminara', 'text' => 'This is going to be super crazy.' )); Comment::create(array( 'author' => 'Holly Lloyd', 'text' => 'I am a master of Laravel and Angular.' )); } }
要调用这个播种机文件,我们要修改“app/database/seeds/DatabaseSeeder.php”并添加以下代码:
// app/database/seeds/DatabaseSeeder.php ... /** * Run the database seeds. * * @return void */ public function run() { Eloquent::unguard(); $this->call('CommentTableSeeder'); $this->command->info('Comment table seeded.'); } ...
现在我们通过artisan命令来运行我们的播种机。
php artisan db:seed
现在我们拥有一个包含评论表的数据库、一个Eloquent模型和一些数据库样本。一天的工作还不算糟。。。但我们还远没有结束。
评论资源控制器(app/controllers/CommentController.php)